jQuery Effects Tutorial: Learn jQuery Effect basic concept, Different Type of jQuery Effects, jQuery Effects Reference Guide, jQuery Effects Examples. In this page to learn the jQuery Effect definition, the Purpose of using jQuery Effects, and how to use jQuery Effects on a web page with examples. Follow and Like us on Facebook, Twitter, LinkedIn, Pinterest for the latest posts.
What are jQuery Effects and their uses?
jQuery Effects: It provides several techniques or methods for adding animation to a web page. Like Hide and show off an object on a web page. Some jQuery Effects are animate, fadeIn, fadeOut, hide, show, slideDown, slideUp, slideToggle, toggle, etc.
jQuery Effects Tutorial: Use of Hide Effect in an HTML Document< html >
< head >
< title >
How to include jQuery in a Document
< /title >
< script src=”https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js” > < /script >
< script >
$(document).ready(function(){
$(".div-box").click(function(){
$(this).hide();
});
});
<
/script
>< /head >
< body >
< div class=”div-box” > Click to hide me. < /div >
< /body >
< /html >
| Effect/Method | Description |
|---|---|
| fadeIn() | Fade in the selected element |
| fadeIn() | Fade out the selected element |
| fadeToggle() | Toggle between FadwIn and FadeOut methods |
| fadeTo() | FadesIn/FadeOut the selected elements to a given opacity |
| animate() | To Create a custom animation on the selected element |
| hide() | Hide the Selected Element |
| show() | Show the Selected Element |
| slideDown() | Slide Down the Selected Element |
| slideUp() | Slide Up the Selected Element |
| slideToggle() | Slide Toggle between SlideUp and SlideDown methods |
| toggle() | Toggle between Hide and Show methods |
| stop() | Stop the running animation on the selected element |
| queue() | Show the queued methods on the selected element |
| finish() | Finish all queued animations on the selected elements |
| dequeue() | Removes the next method from the queue and then executes the method on the selected element |
| delay() | Sets a delay for all queued methods on the selected elements |
| clearQueue() | Clear all queued methods from the selected elements |
Web Design Reference Guide Android App for Website Developers
Web Design Reference Guide Android App: Web Design Tutorial App is a tutorial and reference-based app. It provides Web Design Tutorial and Reference to Web Designers or Web Developers to grow their Web Development skills.
Also Related to this Page
- jQuery Selectors – jQuery Selectors Reference, jQuery Selectors Examples
- jQuery Events Tutorial, jQuery Events Reference, jQuery Events Examples
- jQuery Examples, jQuery Tutorial Examples, jQuery Reference Examples
- jQuery Tutorial, jQuery Reference, jQuery Examples