Thursday, October 13, 2011

JQuery Message FadeIn And FateOut


  1. <html xmlns="http://www.w3.org/1999/xhtml">  
  2. <head>  
  3.     <title>jQuery from Microsoft AJAX CDN</title>  
  4.     <script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.5.js"></script>  
  5.   
  6.     <script>  
  7.       
  8.     $( domReady );  
  9.       
  10.     function domReady() {  
  11.         $('#btn').click( showMessage );  
  12.     }  
  13.       
  14.     function showMessage() {  
  15.         $('#message').fadeIn('slow');  
  16.     }  
  17.       
  18.     </script>  
  19. <script>  
  20.       
  21.     $( domReady );  
  22.       
  23.     function domReady() {  
  24.         $('#btnhide').click( hideMessage );  
  25.     }  
  26.       
  27.     function hideMessage() {  
  28.         $('#message').fadeOut('slow');  
  29.     }  
  30.       
  31.     </script>  
  32. </head>  
  33. <body>  
  34.   
  35. <button id="btn">Show Message</button> 
  36. <button id="btnhide">HideMessage</button> 
  37.   
  38. <div id="message" style="display:none">  
  39.   
  40.     <h1>Hello from jQuery!</h1>  
  41.   
  42. </div>  
  43.   
  44. </body>  
  45. </html>  
at

No comments:

Post a Comment