JQuery a unique thing part- II

Hello friends,

Here i am with II part of Jquery which is  effects.

as a web developer we all need that over web application should look best  for that we do lot of stuff like css. animation and pictures. now.

JQuery gives us the  freedom to do more with  our web application to look better and best.

the effects are given by Jquery is simple and easy to use. so here we go

Jquery makes it easy to show effects now we don’t have to write lot of code for some specific animation here are some example.

$(“element”).toggle(function1,function2) :- By the name its clear that it will toggle the event which we can use in showing different effects.

Ex- if we want to do colour change of div on different click then we do following code

$(“#divtest”).toggle(function() { $(“divtest”).css(“background-color”, “red”);}, function (“divtest”).css(“background-color”,”blue”);});

in the simillar manner we can do different thing also.

$(“element”).hover(function):- for hover effect.

$(“element”).FadeIn(intAmount) :- for fade in effect.

$(“element”).FadeOut(intAmount):- for fade out effect.

$(“element”).hide(intAmount) :- for hide effect.

$(“element”).show(intAmount) :- for show effect.

$(“element”).animate() :- for animation effect we have animate function

for example lets see below example $(“#btnFade”).click(function() { $(“#dvTest”).animate({ “left”: “+=50px” }, “slow”); });

It will increase left of div test by 50px with slow speed.

$(“element”).slideToggle() :- it will move up or down according to last action did by element for example.

$(“#btnOpen”).click(function() {

$(“#dvTest”).slideToggle(‘slow’, animate());

function animate() {



The above button click wiill slide up or down with slow speed.

$(“element”).slideUp(speeed) :- it will slide up the element with desire speed.

$(“element”).slideDown(speed) :- it will slide down the element with desire speed.

$(“element”).fadeTo(speed,opacity):- the extra element is opacity means we can define opacity also with speed for particular element fade effect.

$(“element”).Stop() :- it will stop all the animation running on the element.

i will provide the example of all this things in coming up session.



enjoy the JQuery.


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s