Best jQuery Animation Plugins & Tutorials with Demo

    Image Cross Fade Transition with jQuery

    Image Cross Fade Transition

    Image rollovers were the staple JavaScript nugget of the 90s, and for a lot of JavaScript developers I know, one of the starting places their passion for JavaScript. Today, rollovers are a no-brainer – either in CSS or with the simplest of JavaScript…

    Opera mobile window chooser, recreated with jQuery

    Opera mobile window chooser, recreated with jQuery

    It’s always fun to play with jQuery especially when you are trying to recreate something that you enjoy using. One such thing is window chooser in Opera Mobile browser where opened windows are positioned below each other and only a portion of each window is visible. The one on the top is current window that is fully visible. Clicking on those windows is followed by some nice effect.

    Build a Better Tooltip with jQuery Awesomeness

    Build a Better Tooltip with jQuery Awesomeness

    One of the great tools we have in our web development goodie-bag are tooltips. A tooltip is a box that appears when you hover your cursor over an element like a hyperlink. It provides supplementary information about that element. For example, a link with little or no text (an icon) may become confusing. Provide an extra sentence or two within a tooltip to explain to your users what will happen if they click on it.

    Circular Discography Template with jQuery

    Circular Discography Template with jQuery

    Today we want to share a simple website template with you. The template will show some discography or music albums in a rounded fashion, rotating the albums when clicking on next or previous. When clicking on an album, we will open the album details view which contains a music player (jPlayer) and a playlist of some songs. There is also a description area that can be scrolled.

    SimpleModal a jQuery plugin for modal dialog

    SimpleModal a jQuery plugin for modal dialog

    SimpleModal is a lightweight jQuery plugin that provides a simple interface for creating a modal dialog. The goal of SimpleModal is to provide developers with a cross-browser overlay and container that will be populated with data provided to SimpleModal.

    Wijmo jQuery UI Widgets

    Wijmo jQuery UI Widgets

    Wijmo is a complete kit of over 30 UI widgets with everything from interactive menus to rich charts. If you know jQuery, you know Wijmo. Complete with documentation and professional support, every widget is hand-crafted and includes premium themes.

    BeautyTips a jQuery tooltips plugin

    BeautyTips a jQuery tooltips plugin

    BeautyTips is a jQuery tooltips plugin which uses the canvas drawing element in the HTML5 spec to dynamically draw tooltips associated with a html element on the page. The thing I like best about BeautyTips is it’s limmitless ways to configure the look and feel and event triggering behavior. For example, with BeautyTips it would be relatively easy to match the tooltips used on popular websites like Netflix, Google Maps, Hulu, or Facebook.

    Pietimer jQuery Plugin

    Pietimer jQuery Plugin

    Pietimer injects a canvas element into the page which has an ever reducing pie shaped timer.

    CSS3 Animation With jQuery Fallbacks

    CSS3 Animation With jQuery Fallbacks

    In today’s post, we’ll be taking a look at how you can use CSS3 transitions to power your application’s animations with jQuery’s .animate() method as a fallback where transitions aren’t supported. The benefit of transitions is that unlike JavaScript based animations, they’re hardware accelerated in certain browsers and mobile devices, resulting in a potentially smoother overall animation than you would normally experience.

    Create Smooth Rotatable Images with CSS3 and jQuery

    Create Smooth Rotatable Images with CSS3 and jQuery

    How to use CSS3 and jQuery to create images that can be smoothly rotated using the mouse. Full example and code download included.With the advent of CSS3 transforms, we can do some nice tricks with elements in a web page, including rotation, scaling, and skewing. Once we start throwing jQuery into the mix too, we can start doing some really nice tricks!