Mega Code Archive

 
Categories / JavaScript Tutorial / JQuery
 

Width animation

< html>   <head>     <script type='text/javascript' src='js/jquery-1.3.2.js'></script>     <script type='text/javascript'> $(document).ready(   function() {     $('input#tmpAnimate').click(       function($e) {         $('div#myDialog').animate({             width: '600px',             marginLeft: '-300px'           }, 3000         );       }     );   } );     </script>     <style type='text/css'> div#myDialog {     position: absolute;     top: 50%;     left: 50%;     width: 500px;     height: 200px;     margin: -100px 0 0 -200px;         border: 1px solid rgb(128, 128, 128); } div#tmpButtons {     position: absolute;     bottom: 5px;     right: 5px; }     </style>   </head>   <body>      <div id='myDialog'>        <p>          Dialog        </p>        <div id='tmpButtons'>          <input type='submit' id='tmpAnimate' value='Animate Dialogue' />        </div>      </div>   </body> </html>