Training in Web Technologies

Subbu in Design

Tagged: How to use jQuery Selectors?

jQuery

jQuery finish() Method

<!DOCTYPE html> <html> <head> <script src=”//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js”> </script> <script> $(document).ready(function(){ $(“#start”).click(function(){ $(“div”).animate({height:300},3000); $(“div”).animate({width:300},3000); }); $(“#complete”).click(function(){ $(“div”).finish(); }); }); </script> </head> <body> <p> <button id=”start”>Start Animation</button> <button id=”complete”>Finish Current Animation</button> </p> <div style=”background:#98bf21;height:100px;width:100px”> </div> </body> </html>

jQuery

jQuery Callback Functions

A callback function is executed after the current effect is 100% finished. jQuery Callback Functions JavaScript statements are executed line by line. However, with effects, the next line of code can be run even...

jQuery

How to write jQuery Effect fadeOut() Method?

<!DOCTYPE html> <html> <head> <script src=”//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js”> </script> <script> $(document).ready(function(){ $(“.btn1”).click(function(){ $(“p”).fadeOut() }); $(“.btn2”).click(function(){ $(“p”).fadeIn(); }); }); </script> </head> <body> <p>This is a paragraph.</p> <button>Fade out</button> <button>Fade in</button> </body> </html> Definition and Usage The fadeOut()...

jQuery

How to use jQuery Effect Methods?

jQuery Effect Methods The following table lists all the jQuery methods for creating animation effects. Method Description animate() Runs a custom animation on the selected elements clearQueue() Removes all remaining queued functions from the...