Best jQuery Core Java Script Plugins & Tutorials with Demo

Responsive Gridfolio : JavaScript Html5 Responsive Layout

February 20, 2013 | Core Java Script, HTML5, Layout, Premium, Responsive

The Responsive Gridfolio has a fluid / flexible / responsive layout. Basically the grid is added into a html page into a div of your chosing and it’s adapting based of that div’s width, the grid height is modified based on the thumbnails and if other elements are below the grid div they will be pushed down automatically (document flow).

The Responsive Gridfolio is using the GPU (hardware acceleration) using HTML5 standards. The rendering speed and performance is impeccable on desktop computers and most importantly on mobile devices, the way it works it will try to use CSS3 and if this is not available it will down fall to CSS2 or CSS1 for older browsers like IE7 and IE8.

Read More Demo

Sketch.js : JavaScript Creative Coding Framework

February 18, 2013 | Animation, Core Java Script, HTML5

Sketch.js handles all that tedious but necessary stuff that would normally slow you down – setting up an animation loop, creating and managing a graphics context for Canvas or WebGL, cross browser and device event binding and normalisation for mouse, touch and keyboard events, handling window resizes… You get the idea.

Read More Demo

Moment.js : JavaScript Date library

February 18, 2013 | Core Java Script

Moment.js is a lightweight javascript date library for parsing, manipulating, and formatting dates.Moment was designed to work both in the browser and in Node.JS.

Read More Demo

Layer Styles : HTML5 app for creating CSS3 in a intuitive way

February 17, 2013 | Core Java Script, CSS2 / CSS3.0, Drag & Drop, HTML5, Web

Just like you favorite graphic editor – but in your browser. And it creates CSS.A HTML5 app for creating CSS3 in a intuitive way.

Colorpicker can pick any color of the element your working on
Drag and Drop images onto the page to use them as a background or to pick their colors
Color Swatches, Gradients and Styles are locally stored

Read More Demo

Rainbow : Code Syntax highlighting library written in Javascript

February 14, 2013 | Core Java Script

Rainbow is a code syntax highlighting library written in Javascript. It was designed to be lightweight (1.4kb), easy to use, and extendable.

It is completely themable via CSS. Rainbow on its own is very simple. It goes through code blocks, processes regex patterns, and wraps matching patterns in tags. All the theming is left up to CSS.

Read More Demo

cgSceneGraph : JavaScript & HTML5 Powerful, cross-platform Animation framework

February 13, 2013 | Animation, Core Java Script, Games, HTML5

The cgSceneGraph is a powerful, cross-platform and very easy-to-use animation framework written in JavaScript for the <canvas> tag in HTML5.It’s full object oriented to ease the development of your applications and games.

The power of the framework is inside its concept : the framework itself does not render anything, and provides a lot of cool and useful features. It was designed to be extended : you can use or create an infinite number of extensions of the node class (CGSGNode) to be rendered. You are not, and won’t never be, limited to what the framework provides by itself because it is designed to be extended !

Read More Demo

GSAP JS : Professional-Grade JavaScript Animation Library

February 12, 2013 | Animation, Core Java Script, CSS2 / CSS3.0, Plugins

Animating with code may seem intimidating at first, but don’t worry – the GreenSock Animation Platform (GSAP) was engineered to make it simple and intuitive. The platform is also highly optimized for performance and unprecedented flexibility. Hang in there through the learning curve and you’ll be glad you did.

The GreenSock Animation Platform is a suite of tools for scripted animation. It includes:

TweenLite: the core of the engine which handles animating just about any property of any object. It is relatively lightweight yet full-featured and can be expanded using optional plugins (like CSSPlugin for animating DOM element styles in the browser, or ScrollToPlugin scrolling to a specific location on a page or div, etc.)
TweenMax: think of it like TweenLite’s beefy big brother; it does everything TweenLite can do plus non-essentials like repeat, yoyo, repeatDelay, updateTo(), etc. It includes many common plugins too like CSSPlugin so that you don’t need to load as many files. The focus is on being full-featured rather than lightweight.
TimelineLite: a powerful, lightweight sequencing tool that acts like a container for tweens, making it simple to control them as a whole and precisely manage their timing in relation to each other. You can even nest timelines inside other timelines as deeply as you want. This allows you to modularize your animation workflow easily.
TimelineMax: extends TimelineLite, offering exactly the same functionality plus useful (but non-essential) features like repeat, repeatDelay, yoyo, currentLabel(), and many more. Again, just like TweenMax does for TweenLite, TimelineMax aims to be the ultimate full-featured tool rather than lightweight.
Extras like easing tools, motion paths, plugins, blitting tools, and more

Read More Demo

retina.js : JavaScript Serve high-resolution Images to Retina devices

February 7, 2013 | Core Java Script, Image Effects

retina.js is an open source script that makes it easy to serve high-resolution images to devices with retina displays.When your users load a page, retina.js checks each image on the page to see if there is a high-resolution version of that image on your server. If a high-resolution variant exists, the script will swap in that image in-place.

Read More Demo