Best jQuery Animation Plugins & Tutorials with Demo

    Easy Display Switch with CSS and jQuery

    Easy Display Switch with CSS and jQuery

    Today, I would like to go over a quick and simple way to allow your users to switch page layouts by using CSS and jQuery.Today’s web users expect web pages to be increasingly more interactive. To this end, the ability to change page layouts provides your users with a more immersive experience and allows them to consume information more easily, either with a quick gallery view, or a detailed summary view.

    Overlay-like Effect with jQuery

    Today we will create a slick overlay effect with jQuery that does not use an overlay. The idea is to change the opacity or the color of certain elements in order to make it look like as if we are covering the content with an overlay. This allows to focus certain elements in a web page while making others appear less prominent.

    jQuery Roundrr – How To Create Circular Image Galleries With jQuery

    How To Create Circular Image Galleries With jQuery

    I’m going to introduce you to some of the concepts involved in getting the coordinates we need to plot our image galleries around a shape and in part 2 I’ll introduce you to jQuery Roundrr plugin I wrote that will allow you to easily create interactive event-based galleries using jQuery and a little CSS.

    jQuery UI CoverFlow 2.0

    jQuery UI CoverFlow 2.0

    I would like to show you how to create and use a jQuery UI CoverFlow component powered by $.widget and CSS3 transforms. It’s highly extensible, supports click, keyboard and mousewheel interaction.The iTunes CoverFlow effect is one of my favorite user-interface patterns – it’s excellent for navigating around large collections of images (or data represented by images) and I thought it would be of great benefit to put out an updated version of this component out there.

    An Awesome jQuery Plugin For Creating Magical Layouts – Isotope

    jQuery Plugin For Creating Magical Layouts – Isotope

    Isotope is an impressive jQuery plugin that enables us to sort items and create smart layouts.Using the plugin, any given list of items can be filtered with show/hide effects and they can be re-ordered with slick animations.The plugin’s layout features are very powerful as well. With a simple function, items can be converted into horizontal/vertical layouts or arranged intelligently within a grid and much more. And, all with nice animations.

    jQuery Quickie: Smooth animated quote display

    jQuery Quickie: Smooth animated quote display

    Here is the new way to display quote using jQuery.Time for yet another jQuery quickie! These relatively simple jQuery tutorials will show you a simple, yet beautiful effect making use of jQuery. This way, you can learn and create something very cool at the same time.

    jQuery Fullscreen Gallery with Thumbnail Flip

    Fullscreen Gallery with Thumbnail Flip

    In this tutorial we will create a fullscreen gallery with jQuery. The idea is to have a thumbnail of the currently shown fullscreen image on the side that flips when navigating through the images. The big image will slide up or down depending where we are navigating to. We will add navigation controls for the mousewheel and for keys. The thumbnail will have a zoom and and a fullscreen option, making the image in the background appear in fullscreen mode or as a complete image, resized to fit in the page.

    Vertical Scroll Menu with jQuery Tutorial

    Scroll Menu with jQuery Tutorial

    Just last week, I came accross to this website Narrow Design. His scroll menu caught a lot of my attentions, I played with it for a while. Yes, unfortunately, it’s built in flash. And, Yes, we are going to implement it with jquery – javascript based scroll menu that will do the same thing. Of course, it will not be 100% the same, because some of the fancy features just not that practical to implement with javascript.

    How to Make Auto-Advancing Slideshows with jQuery & HTML5

    How to Make Auto-Advancing Slideshows

    One of the most requested improvements over the tutorials presented on this site, when it comes to slideshows, is the ability to have the slides advance automatically. It is actually not that difficult to achieve this effect, and to demonstrate it, in this short tutorial we are going to make our HTML5 Slideshow auto advance with a few lines of jQuery.

    Display Your Favourite Music with jQuery & Last.fm

    Display Your Favourite Music with jQuery & Last.fm

    Use the power of jQuery and the handy last.fm records plugin to create a showcase of your favourite music on your website. We’ll install the plugins to fetch the information from the Last.fm website, then style up the design with a cool retro vinyl record theme.