Jquery effects in Hindi

Post Views : 191

Introduction

हेलो दोस्तों आज हम इस post में jquery के इस्तेमाल से हमारे document (webpage) में कई प्रकार की effects सेट करा सकते है तो हम आज इसके बारेमे जानेगे!.

Jquery effects

jquery effects जैसे की hide, show, toggle, slide, fade, animate जैसे कई प्रकार की effects हम जक्वेरी के इस्तेमाल से add करा सकते!

jquery hide / show

jquery के hide() और show() methods का इस्तेमाल करके HTML document elements को hide और show करा सकते है!.

Syntax:

$(selector).hide(speed,callback);
$(selector).show(speed,callback);

Example:

$("#hide").click(function(){
  $("h3").hide();
});
//OR
$("#show").click(function(){
  $("h3").show();
}); 	

jquery fade effect

jquery के साथ आप element की visibility fade in और out कर सकते है!.

Syntax:

$(selector).fadeIn(speed,callback);
$(selector).fadeOut(speed,callback);

fadeIn() और fadeOut() method में दो optional parameter होते है एक है speed parameter है specifies effects का duration decided करता है!. speed parameter में हम ‘slow’,’fase’ और milliseconds value रख सकते है!.
और दूसरा optional callback parameter वह fading effect completed होने के बाद में executed होता है!.

Example:

$("Selector").click(function(){
  $("#h1").fadeIn();
  $("#h2").fadeIn("fast");
  $("#h3").fadeIn(5000);
});
//OR
$("Selector").click(function(){
  $("#h1").fadeOut();
  $("#h2").fadeOut("fast");
  $("#h3").fadeOut(5000);
});

jquery slide effect

किसी बी element को slide down/up करने के लिए slideDown/slideUp method का इस्तेमाल किया जाता है!.

Syntax:

$(selector).slideDown(speed,callback);
$(selector).slideUp(speed,callback);

Example:

$(".className").click(function(){
  $("#panel").slideUp();
});  
//OR
$(".className").click(function(){
  $("#panel").slideDown();
});

jquery animate effect

jquery animate() method का इस्तेमाल custom animations create करने के लिए किया जाता है!.

Syntax:

$(selector).animate({params},speed,callback);

jquery animate() method में params parameter एक required parameter है. और वह animated के लिए css properties defines करता है!.
और दूसरे speed and callback optional parameter है!.

Example:

$("ClassName").click(function(){
  $("section").animate({left: '450px'});
});

jquery stop()

jquery stop() method animations और effects को stope कर देता है उसकी effect finished होने से पहले. stop() method jquery के सभी effect functions, custom animations effects के लिए work करता है!.

Syntax:

$(selector).stop(stopAll,goToEnd);

Example:

$("#stop").click(function(){
  $("#panel").stop();
});