Introduction to Jquery Effects with example

| Last Updated: | In: Javascript & Ajax


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() :

Tags: ,


About: Prem Tiwari

Prem Tiwari is the founder of freewebmentor.com and is a professional developer who has vast experience in PHP and open source technologies. Apart from this, he is a blogger by hobby.


You may also like:

Get Free Access of 450+ Scripts

Don't worry you'll not be spammed!

Featured eBook

WordPress Security Guide

Free Guide: Learn how to implement security guideline in your WordPress site...

DOWNLOAD

Free WordPress Setup Service

Free WordPress Setup

Want to Setup WordPress Blog Setup? I will help you in the setup of your WordPress blog.

Click Here

Pincode Finder

pincode-finder tool

Online Pincode Finder

Best tool to locate post Office address and pincodes of all india...

SEARCH NOW