tl  tr
  Home | Tutorials | Articles | Videos | Products | Tools | Search
Interviews | Open Source | Tag Cloud | Follow Us | Bookmark | Contact   
 jQuery > Basic > Fade in/out elements

Fade in/out elements 

This example shows how to fadein/fadeout the elements using jQuery API.

File Name  :  
source/JQUERY/basic/fade.html 
Author  :  Sudhakar KV
Email  :  kvenkatasudhakar@gmail.com
view sourceprint?
01<html>
02 <head>
03 <script type="text/javascript" src="js/jquery.js"></script>
04 <script type="text/javascript">
05 
06$(function(){
07 
08  $("#FadeIn").click( function() {
09 
10 
11        $("#test").fadeIn("slow",function(){
12          alert("FadeIn Done.");
13        });
14 
15  });
16 
17  $("#FadeOut").click( function() {
18 
19        $("#test").fadeOut("slow",function(){
20          alert("FadeOut Done.");
21        });
22 
23  });
24 
25 
26});
27 </script>
28 </head>
29 <body>
30    <input type="button" id="FadeIn" value="FadeIn"  />
31    <input type="button" id="FadeOut" value="FadeOut"  />
32 
33    <br><br>
34 
35    <div id="test" style="background-color:pink;width:200px;height:200px">
36    Test
37    </div>
38 </body>
39 </html>




 
  


  
bl  br