Open In App
Related Articles

jQuery UI Dialog resize Event

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Report issue
Report

jQuery UI resize event is triggered when the dialog box is resized.

Learn more about jQuery selectors and events here.

Syntax:

$(".selector").dialog (
   resize: function( event, ui ) {
       console.log('resized')
   },

Approach:

  • First, add jQuery Mobile scripts needed for your project.
<link href = “https://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css” rel = “stylesheet”> <script src = “https://code.jquery.com/jquery-1.10.2.js”></script> <script src = “https://code.jquery.com/ui/1.10.4/jquery-ui.js”></script>

Example 1:

HTML

<!doctype html>
<html lang = "en">
   <head>
      <meta charset = "utf-8">
      <link href
         rel = "stylesheet">
      <script src = "https://code.jquery.com/jquery-1.10.2.js">
        </script>
         </script>
        
  
      <script type = "text/javascript">
         $(function() {
            $( "#gfg2" ).dialog({
          autoOpen: false, 
               resize: function( event, ui ) {
                  console.log('resized')
               },
            });
            $( "#gfg" ).click(function() {
               $( "#gfg2" ).dialog( "open" );
            });
         });
      </script>
   </head>
     
   <body>
      <div id = "gfg2" title="GeeksforGeeks">
         <textarea>jQuery UI | resize(event, ui) Event</textarea>
      </div>
      <button id = "gfg">Open Dialog</button>
   </body>
</html>

                    

Output:



Last Updated : 02 Dec, 2021
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads