Best jQuery Animation Plugins & Tutorials with Demo

    Creating a fading header in jQuery

    Creating a fading header in jQuery

    A simple example using jQuery and CSS that shows you how to create the fading header technique.

    Jquery: cool background animation

    jQuery background animation

    in this article I will show you how to make cool background animation with jquery. With this script you can make fresh new look to your web site or just experiment.

    jRumble – jQuery Plugin for rumbles, vibrates, shakes, and rotates

    jRumble - jQuery Plugin for rumbles, vibrates, shakes, and rotates

    jRumble is a jQuery plugin that rumbles, vibrates, shakes, and rotates any element you choose. It’s great to use as a hover effect or a way to direct attention to an element. You can control the X, Y, and rotation range, the speed, and event trigger for the rumble.

    jQuery.folderPreview

    jQuery folderPreview

    jQuery.folderPreview is a jQuery plugin that takes a series of images and positions them so that they appear within a folder graphic. This enhances the attractiveness of a browsing UI system, allowing the user to visualize the contents of the folder. Highly customizable, folderPreview scales back images, “tucks” them in behind a folder graphic using CSS positioning techniques, and rotates them slightly with a separate compatible plugin (jQuery.rotate). It can also select images to process randomly via jQuery.shuffle.

    PhotoSmart jQuery Gallery Plugin

    PhotoSmart jQuery Gallery Plugin

    PhotoSmart is a jQuery based thumbnail gallery. It allows you to create multiple galleries on a single webpage or on multiple webpages. It has a number of different effects that can be applied or changed very quickly. All galleries are created in code from your gallery folder its then just a matter of adding the gallery element in your webpage. There are a number of load effects, mosaic, zig-zag, faderows and a few more.

    A simple animated background with Jquery

    A simple animated background with Jquery

    In this tutorial I will explain How to create a simple scrolling background with Jquery.

    $().transformable() Rotate Skew and Scale your div

    jQuery Rotate Skew and jQuery Scale your div

    If you use Draggable and Resizable, extend this with Transformable. You will find four new handles to Rotate, Skew horizontal, Skew vertical and Scale. This will not just change the appearance of your div, but of all its contents as well, including text, pictures and other divs.

    jQuery Content/Thumbnail slider : jsCarousel V2.0

    jQuery Content/Thumbnail slider : jsCarousel V2.0

    jsCarousel v2.0 is a jquery slider plugin that slides contents in multi direction. Now it supports both horizontal and vertical orientation, see the screen shot below. jsCarousel v2.0 slider can be used as a feature content slider as well. You can put any kind of contents you want whether images, text, videos, news etc. it’s up to you. One interesting thing about jsCarousel v2.0 slider is that you can make simple image gallery with thumbnail support by using it. jsCarousel v2.0 slider plugin gives you the source of image via callback function, when you click on some image within slider. See Using jsCarousel v2.0 Slider section below to get an idea about using the callback function.

    JQuery Welcome Box

    JQuery Welcome Box

    The JQuery welcome box slides a div in the center of the screen. The background is disabled, so the use must first close the welcome box to continue to use your website.

    JQuery slideTo function

    JQuery slideTo function

    Jquery slideTo function. With this function you can slide an element to a given position on your webpage. There are four option to define the position. Special to this function is that you have the ability to slide to the center of the screen and also to the bottom and/or right of the screen.