jQuery Hide/Show

With jQuery, you can hide and show HTML elements with the hide() and show() methods:

$(“#hide”).click(function(){ $(“p”).hide(); }); $(“#show”).click(function(){ $(“p”).show(); });

jQuery Fadein/Fadeout

With jQuery you can fade elements in and out of visibility.

$(“button”).click(function(){ $(“#div1”).fadeIn(); $(“#div2”).fadeIn(“slow”); $(“#div3”).fadeIn(3000); }); $(“button”).click(function(){ $(“#div1”).fadeOut(); $(“#div2”).fadeOut(“slow”); $(“#div3”).fadeOut(3000); });

jQuery Animation

for animate text or image etc.

$(“button”).click(function(){ $(“div”).animate({left: ‘250px’}); });

jQuery Chainning

Chaining allows us to run multiple jQuery methods (on the same element) within a single statement.

$(“#p1”).css(“color”, “red”) .slideUp(2000) .slideDown(2000);

jQuery add css

Add css through jQuery

$(“p”).css(“background-color”, “yellow”);

jQuery Event

To handle event

$(“p”).click(function(){ // action goes here!! });

jQuery Slide

The jQuery slide methods slide elements up and down.

$(“#flip”).click(function(){ $(“#panel”).slideDown(); });

jQuery Remove

To remove elements and content

$(“#div1”).remove();

jQuery Prop (For multiple properties and values:)

The jQuery prop() method is generally used to retrieve property values.

$(selector).prop({property:value, property:value,…})

jQuery Has Class

The jQuery hasClass() method is used to check whether selected elements have specified class name or not.

$(selector).hasClass(classname)