Introduction to Jquery Effects with example

Prem Tiwari - - JavaScript


jQuery makes it trivial to add simple effects to your page. Effects can use the built-in settings, or provide a customized duration. You can also create custom animations of arbitrary CSS properties.

Hiding and Showing Contents

In the jQuery you can hide and show the contents instantaneously with .show() or .hide().

Fade and Slide Animations

There are additional methods that can help. .slideDown() and .slideUp() show and hide content, respectively, using only a slide effect. Slide animations are accomplished by rapidly making changes to an element’s CSS height property.

Changing Display Based on Current Visibility State

Using the JQuery you can also change a content’s visibility based on its current visibility state. .toggle() will show content that is currently hidden and hide content that is currently visible.

Managing Animation Effects

jQuery provides some additional features for controlling your animations using .stop() and .delay().

Example .stop() :

Example .delay() :


Prem Tiwari

Prem Tiwari is the founder of FreeWebMentor.com and also a professional developer and a blogger by hobby.

Tags: ,

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.