Back in the day, if you saw something that was animated on a website it was automatically assumed to be Flash. But not anymore, with jQuery you may become interested in creating animated effects, so here are some jQuery Animation Effect tutorials to get you on your way. Have fun!

Related Posts:

1. like Animated Feeds Display with Jquery

In this tutorial you will learn a simple way to create same RSS scrolling ticker using jQuery. like Animated FeedsSource

2. Pointer Trails with jQuery

Learn how to create a pointer trail on your web-page with the help of jQuery.

Pointer Trails

Source + Demo

3. jQuery Animate in Circular Path

Learn how to animate an element in circular path or over a circle using jQuery.

jQuery Animate


4. Animate Color using jQuery

Animate a change in background Color using jQuery.

Animate Color

Source + Demo

5. Dream Night Animation with jQuery

The DreamNight is a screen saver in my friend’s cellphone, I tried to implement it on web with help of jQuery and CSS.

Dream Night Animation


6. Incredible Login Form with jQuery

In this tutorial, we’ll create a sliding panel, that slides in to reveal more content, using JQuery to animate the height of the panel.

Incredible Login Form


7. Load In and Animate Content with jQuery

In this tutorial we will be taking your average everyday website and enhancing it with jQuery. We will be adding ajax functionality so that the content loads into the relevant container instead of the user having to navigate to another page.

Load In and Animate Content


8. Using jQuery for Background Image Animations

jQuery is a great library for this type of task but out of the box, it can’t animate background position properly because of the need to animate two values instead of just one.

Background Image Animations


Sam Deering is a Front-end Web Developer who specialises in JavaScript & jQuery. Sam is driven and passionate about sharing his knowledge to educate others.

Free Guide:

How to Choose the Right Charting Library for Your Application

How do you make sure that the charting library you choose has everything you need? Sign up to receive this detailed guide from FusionCharts, which explores all the factors you need to consider before making the decision.

Learn JavaScript for free!
Free course: Introduction to JavaScript

Yours when you take up a free 14-day SitePoint Premium trial.