Best jQuery Animation Plugins & Tutorials with Demo

    Polaroid Stack to Grid Intro Animation

    Polaroid Stack to Grid Intro Animation

    A tutorial on how to create an intro animation where a decorative Polaroid stack becomes a grid similar to the effect seen on the takeit website.

    Smooth Animate : Make your Animations Really Smooth

    Smooth Animate : Make your Animations Really Smooth

    SmoothAnimate is tiny, super lightweight (5.2kb minified) javascript plugin that is designed to replace horribly slow jQuery’s $.animate().It makes your animations really smooth and fast unlike jQuery.

    Features:

    • Faster than jQuery – a few tens of times faster!
    • Smoother than CSS – indeed
    • 28 predefined Easings – + your own custom cubic Bezier curves
    • Small size – something about 5 kb in minified version
    • Cross-browser code – support IE9+/Firefox/Chrome/Opera/Safari
    • No Dependencies – written in pure JS, also works with jQuery

    Sliding Panels Template with CSS & jQuery

    Sliding Panels Template with CSS & jQuery

    A simple portfolio template, with project preview images that slide out to reveal the selected project.

    Viavi CSS3 Button Hover Effect

    Viavi CSS3 Button Hover Effect

    Viavi CSS3 Button Hover Effect is pure HTML5/CSS3 flat buttons. Buttons has HTML5 structure and works on all major browsers. Buttons is easy to edit and integrate into any website. CSS is separate from HTML and is well commented.

    Replete Modal : Responsive jQuery Popup Modal

    Replete Modal : Responsive jQuery Popup Modal

    Replete Modal is a user-friendly, fully customizable, responsive jQuery popup modal to take any HTML content, including images, videos, SVG icons,forms and display it in a clean organised and responsive popup. It is easy, flexible, powerful to create professional looking popup modal. This plugin features plenty of layouts, CSS transitions, SVG Icons, and animations, 9 Position, 40+ animations, 5 Overlay, 10 Modal Layouts, 10 Modal Types, 35+ SVG Icons and much more.

    Creating Loading Buttons with SVG & Segment

    Creating Loading Buttons with SVG & Segment

    The idea that we will develop in this tutorial is basically a few loading buttons that will be able to give a feedback response, showing whether the button action succeeded or failed. To achieve the desired animations we will be using SVG and Segment mostly.

    Mobile Material Design Cards with jQuery

    Mobile Material Design Cards with jQuery

    When someone clicks a card we move it to the center of the screen along the vertical axis. Once it reaches the center of the screen, the full card view expands from the center of the screen.

    jQuery jSon Slider, Carousel & Timeline Plugin

    jQuery jSon Slider, Carousel & Timeline Plugin

    The jSon Slider is a multi purpose jQuery plugin. We can crate slider, carousel & timeline.It is a responsive and fast-loading slider with built-in search functionality and other powerful features.

    Features:

    • Very fast-loading slider
    • CSS3 & jQuery animation
    • Carousel (Option for setting different numbers of slides for Desktop, Tablet and Mobile)
    • Testimonial, Tab & Timeline
    • Search within slides
    • YouTube and HTML5 videos in slides
    • Full screen
    • Thumbnails, bullets or HTML
    • Multiple sliders allowed on one page
    • Slides can be selected using a GET method in URl

    Button Hover effects using CSS3

    Button Hover effects using CSS3

    Custom hand code css3 with ultimate css button hover effects and also change text on hover with css3 effects.