Width Control Jquery UI.html

<html>
    <head>
       <link rel="stylesheet" href="css/style.css">
       <link rel="stylesheet" href="jqueryui/jquery-ui.css">
       <link rel="stylesheet" href="jqueryui/jquery-ui.structure.css">
       <link rel="stylesheet" href="jqueryui/jquery-ui.theme.css">

    </head>
    <body>
        <div id="div1">
            <h3>Introduction to JQuery UI</h3>
            <img src="IMG_20200604_181220.jpg" width="200px" title="Akash" id="pic1">
        </div>
    </body>

   <script src="jquery.js" type="text/javascript"></script>
   <script src="jqueryui/jquery-ui.js" type="text/javascript"></script>
   <script>
        $("#pic1").tooltip({
            track:true,
            show:{effect:"pulsate",duration:2000},
            //show:{effect:"bounce",duration:2000}
            //show:{effect:"highlight",duration:2000}
            //show:{effect:"explode",duration:2000}
            //show:{effect:"blind",duration:2000}
            hide:{effect:"explode",duration:3000}


        });
      
   </script>
   
</html>