Best jQuery Animation Plugins & Tutorials with Demo

    TagCanvas – jQuery Animated Tag Cloud

    jQuery Animated Tag Cloud

    An HTML5 canvas-based plugin which replaces <a href="..."> links with a 3D rotating cloud of tags.

    Tested in FireFox, Chrome, Opera, Safari. Also tested in IE8, where it obviously doesn’t work except in conjunction with ExplorerCanvas. Now works in the IE9 beta/release candidate without ExplorerCanvas.

    Animated Scroll to Top

    jquery Animated Scroll to Top

    I’m writing a detail tutorial on how to create an animated scroll to top as seen on Web Designer Wall. It is very simple to do with jQuery (just a few lines of code). It checks if the scrollbar top position is greater than certain value, then fade in the scroll to top button. Upon the link is clicked, it scrolls the page to the top.

    Sliding Background Image Menu with jQuery

    Sliding Background Image Menu with jQuery

    Today we want to share another jQuery menu with you. This menu will have several panels, each one corresponding to a different background image that will show on all panels when we hover over a panel label. Also, a submenu will slide out from the bottom. This menu comes with some configuration possibilities, such as the size of the image, the hover effect and custom default states.

    Jquery Animated Grid Plugin

    Jquery Animated Grid Plugin

    This animated Grid Plugin is compatible with Mozilla Firefox, Safari, IE8 / IE7, Google Chrome and allow you to control completely the degradation if javascript is disable.

    Simple Overlay – jQuery plugin

    Simple Overlay - jQuery plugin

    A jQuery Plugin for easily adding lightweight, flexible overlays to your projects.

    Use custom effects, customize using CSS hooks, define custom callbacks for further action, take advantage of CSS3 and more.

    Create a grid Image Gallery that has intersecting highlights with jQuery and CSS

    jQuery CSS grid Image Gallery

    In this image gallery, I wanted to create the effect of intersecting lines to highlight the selected image in a grid like a crosshair. I used differing opacities of images horizontally across from the current image and vertically above or below the image to achieve this effect. This gallery uses jQuery Masonry to achieve the animated resizing effect of the grid.

    Analog JQuery clock

    JQuery Analog clock

    In this tutorial we will use JQuery and a plugin named jQueryRotate.The main idea behind making this watch is to rotate the three images according to the actual time tt/mm/ss. We split that time up in hours, minutes and seconds. Then use some math to convert each of the three values into an angle between 0 and 360. one for each of our three pointers. Then we use a timer function in JQuery to do that every second. That will make it look like the pointers is ticking like a real watch.

    Color Changing Text and Backgrounds w/ jQuery

    Changing Text and Backgrounds with jQuery

    Normally you would define the text color in the CSS and that would be the end of it. In this tut, you will learn how to be able to adjust colors after the page has loaded, and not just once either – you’re aiming for continuous adjustments.

    Using Flux Slider jQuery plugin

    jQuery Flux Slider

    Using Flux Slider jQuery plugin Today I will make review (example of implementation) of fresh and cool slider plugin – Flux. This slider using CSS3 animation with great transition effects (like: bars, zip, blinds, blocks, concentric, warp). And, what is most great – now it can support 3D transitions too (bars3d, cube, tiles3d, Blinds3D effects).

    gameQuery a game engine for jQuery

    jQuery Game engine

    gameQuery is a jQuery plug-in to help make javascript game development easier by adding some simple game-related classes. It’s still in an early stage of development and may change a lot in future versions.

    gameQuery has the following features:

    • multi layer-sprite animations
    • sprite hierarchies (grouping)
    • collision detection
    • swappable sound support
    • periodic callbacks
    • keyboard state polling
    • free and open source license