Best jQuery Animation Plugins & Tutorials with Demo

    jQuery UI text effects with Demo

    jQuery UI text effects with Demo

    Each effect is highly configurable. Here is a general list of the options available in each effect (also changelog):

    • Whether or not the text should be split into words rather than characers
    • Text to use instead of the element’s innerHTML
    • The distance the pieces travel (as a multiple of the element’s respective dimensions)
    • ++ added ++ The direction the pieces travel
    • Whether or not to fade the pieces in/out
    • How much the effect should be randomized (a percentage)
    • ++ added ++ stop elements from leaving the document’s boundaries

    jPaginate: A Fancy jQuery Pagination Plugin with Demo

    jPaginate: A Fancy jQuery Pagination Plugin with Demo

    jPaginate is a jQuery pagination plugin that comes with a twist: animated page numbers. The user can slide through the available page numbers by clicking or just hovering over the arrows. Shortlinks to the first and last page are available as well.

    jQuery Flashing text with Demo

    jQuery Flashing text with Demo

    In this tutorial I will show you how to create a flashing text effect with JavaScript and a small portion of jQuery.Sometimes you might need to bring your visitors attention to some particular text or phrase, and the most obvious way of doing it is by using some flashing / animating effect.

    jQuery.twinkle : On Click Animation with Demo

    jQuery.twinkle : On Click Animation with Demo

    jQuery twinkle a on click animation.Draw your visitor’s attention to special parts of your website. Examples of the different effects and options are right below.

    Parallax Content Slider with CSS3 and jQuery

    Parallax Content Slider with CSS3 and jQuery with Demo

    Today we want to share a simple jQuery parallax content slider with you. Using CSS animations, we’ll control the animation of each single element in the slider and create a parallax effect by animating the background of the slider itself.

    The idea for this comes from the slider of the Kendo UI homepage, a framework for modern HTML UI. After we got some requests and questions about how to do something like that, we decided to recreate the effect.

    jQuery Animated Filter gallery : Filters

    jQuery Animated Filter gallery : Filters

    Filters is a jQuery plugin that allows to filter items using custom animation. You can use CSS3 transitions or just fadeIn/Out effect. Go to the demos and see how simple is that.

    ghostType jQuery text effect Plugin

    ghostType jQuery text effect Plugin

    This is a classy jQuery text effect that makes the text look like it’s being typed across the screen. A great way to call attention to a specific area of the page and it’s just a block of text within a class. This means the text is fully readable by search engines.ghostType simulates the effect of typing text in real-time. The text within a designated document element is transformed into a seemingly live message.

    Engage your users with a message that unfolds right before their eyes, as if you were typing a message to them in real-time.

    Scrolling Parallax: A jQuery Plugin

    Scrolling Parallax: A jQuery Plugin

    Scrolling Parallax is a new jQuery plugin that binds a parallax effect to the scrollbars and mouse wheel. This allows a background image or anything else to scroll at a different pace than the web page when a user scrolls around. The parallax effect that results is an easy way to create an illusion of depth on your website.

    The Scrolling Parallax plugin is also very versatile. There are a wide variety of options including scrolling faster, slower, looping and reversing the animation and tiling the background to name a few. Addtionally you can attach the parallax to any piece of markup, as well as pass an image path as described above.

    YMslider Content Slider jQuery Plugin

    YMslider Content Slider jQuery Plugin

    It is a simple dynamic, light-weight (2,2K minified, lighter GZipped) and non-intrusive content slider jQuery plugin, fully CSS customizable (theme support) with respect of accessibility and W3C standard rules (strict xHTML valid) …