11375 sujets

JavaScript, DOM et API Web HTML5

Bonjour a tous

sur ce site j'avais vu un plugin génial mais que je ne retrouve plus

lorsque je fermais la boite de dialogue on voyait la boite de dialogue partir vers le coin supérieur de l'écran tout en se fermant

c'était sur cette page

https://jqueryui.com/dialog/#animated

cela fait plusieurs jours que je recherche un exemple , mais impossible a trouver ...

cela se passe dans le hide apparemment
je souhaiterais donc avoir un effet visuel de la boite de dialogue qui se ferme tout en se dirigeant vers le coin supérieur droit
voici le code
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>jQuery UI Dialog - Animation</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-3.6.0.js"></script>
  <script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>
  <script>
  $( function() {
    $( "#dialog" ).dialog({
      autoOpen: false,
      show: {
        effect: "blind",
        duration: 1000
      },
      hide: {
        effect: "explode",
        duration: 1000
      }
    });
 
    $( "#opener" ).on( "click", function() {
      $( "#dialog" ).dialog( "open" );
    });
  } );
  </script>
</head>
<body>
 
<div id="dialog" title="Basic dialog">
  <p>This is an animated dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the &apos;x&apos; icon.</p>
</div>
 
<button id="opener">Open Dialog</button>
 
 
</body>
</html>