Best jQuery Core Java Script Plugins & Tutorials with Demo

    HTML5 Interactive World Map with JavaScript

    HTML5 Interactive World Map with JavaScript

    This map is built in HTML5 code and runs with javascript based on the new technique of Scalable Vector Graphics (SVG), So it can be scaled to any size without losing its quality.

    ahRelax : JavaScript Scroll based Parallax Animations

    ahRelax : JavaScript Scroll based Parallax Animations

    Experimental lightweight JS script to facilitate quick scroll based animations.

    Inspiration for Dialog Effects with CSS3 SVG

    Inspiration for Dialog Effects with CSS3 SVG

    A small collection of dialog effects using CSS animations for your inspiration. Some effects use SVG animations of morphing paths with the help of Snap.svg.

    CSS3 Page Transitions

    CSS3 Page Transitions

    A rework of the original idea created by Hakim El Hattab. Created using JavaScript, CSS 3D transforms and CSS Animations.

    • Kontext: Original idea by Hakim El Hattab
    • Put On: A page drop effect
    • Circle: Layers do a circle transition
    • Bounce: Layers bounce after showing
    • Flip: 360º flip

    HTML5 Face Builder

    HTML5 Face Builder

    This application allows your members to create their own Faces (or avatars). The script generates a result image which can be used wherever you want (your website or any other social network)

    Features

    • Small size (lightweight)
    • Minimalist design
    • 6 different tunable parts
    • Every created face image has a unique filename (jpg)
    • Detailed documentation (about installation and params) is included in the product

    Shifty : A teeny tiny tweening engine in JavaScript

    Shifty : A teeny tiny tweening engine in JavaScript

    Shifty is a tweening engine for JavaScript. It is a lightweight library meant to be encapsulated by higher level tools. At its core, Shifty provides:

    • Interpolation of Numbers over time (tweening)
    • Playback control of an individual tween
    • Extensibility hooks for key points in the tweening process

    This is useful because it is the least amount of functionality needed to build customizable animations. Shifty is optimized to run many times a second with minimal processing and memory overhead, which is necessary to achieve smooth animations.

    3D Business Card Flipper

    3D Business Card Flipper

    Whether you’re showing your designs to a client or just want an online business card, this 3D flipper is a creative and fun way to show off your work. You can include designs of any size, so it doesn’t even need to be a business card. It could be a poster, flyer, announcement, or anything else that’s flat and has two sides. You can show multiple cards at once, or one at a time with buttons to cycle through additional cards.

    C3.js : D3-based reusable chart library

    C3.js : D3-based reusable chart library

    C3 is a D3-based reusable chart library that enables deeper integration of charts into web applications.C3 makes it easy to generate D3-based charts by wrapping the code required to construct the entire chart.

    SVG Morpheus : JavaScript library for SVG icons to morph

    SVG Morpheus : JavaScript library for SVG icons to morph

    JavaScript library enabling SVG icons to morph from one to the other.

    ProgressBar.js : Beautiful and Responsive Progress bars

    ProgressBar.js : Beautiful and Responsive Progress bars

    Beautiful and responsive progress bars with animated SVG paths.ProgressBar.js uses shifty tweening library to animate path drawing. So in other words, animation is done with JavaScript using requestAnimationFrame. Animating with JS gives more control over the animation and is supported across major browsers.