This is a very simple concept with setTimeout() but the animation is very interesting.
http://awrdev.g3tech.in/timeouts.html <html> <head> <link rel="stylesheet" href="/css/stylesheet.css" type="text/css" /> <script src="/jquery/jquery.min.js"> </script> <script> $(function() { $('#add').click(function() { $(this).attr("disabled", true); $('#container').append("<h3>How are you?</h3><br/><br/><h2>This is sample text</h2><br/><br/><span>END</span>"); setTimeout("$('h3').fadeOut();", 5000); setTimeout("$('h2').fadeOut();", 15000); setTimeout("$('span').fadeOut();", 10000); setTimeout("$('#container').html('<h2> I am left still</h2>');$('#add').attr('disabled', false);", 20000); }); }) </script> </head> <body> <h1> Timeouts demo</h1> <input id='add' type="button" value="Start demo" /> <p> Vanishing text demo</p> <div id="container"></div> </body> </html> It is actually very simple logic. I have 3 one shot timers. And together they make a nice animation. And I also do a smart thing.I disable the demo button till the anime is over. -Girish -- Gayatri Hitech http://gayatri-hitech.com _______________________________________________ ILUGC Mailing List: http://www.ae.iitm.ac.in/mailman/listinfo/ilugc ILUGC Mailing List Guidelines: http://ilugc.in/mailinglist-guidelines
