3
Jan
// php the_time('Y') ?>
Scrollorama is a jQuery plugin for creating eye-candy effects in parallel to the scrolling of web pages.
By dividing the content into blocks, it simply lets us to animate elements on the page (when a block is reached) based on the browser window’s scroll position.
The animations are accomplished using CSS properties, durations of them can be defined and it is also possible to set the exact scrolling positions of the start/stop events.

Requirements: jQuery
Compatibility: All Modern Browsers
21
Dec
// php the_time('Y') ?>
Textualizer is a lightweight (4kb minified) jQuery plugin for creating good looking effects on text.
The plugin accepts any number of sentences (or words) and can rotate them smartly and beautifully.

Once a sentence is about to rotate with the other one, the letters that will be re-used are kept and move to their new locations with several effects to choose from (fadeIn, slideLeft, slideTop).
It is possible to define the duration that each item will be displayed and also the duration of the transitions. Also, functions exist to stop or pause the rotation.
Requirements: jQuery
Compatibility: All Major Browsers
14
Nov
// php the_time('Y') ?>
CSS transitions and transforms provide a wide range possibilities for animating and morphing HTML elements.
If you would like to use them inside jQuery, jQuery Transit reaches to the rescue.
It is a plugin for implementing CSS transitions and transforms, has the same syntax as .animate, supports most of the methods and has the jQuery juice like callbacks, chaining, auto-browser-prefixes and more.

The plugin uses jQuery’s effect queue by default, so, transitions will never run in parallel.
It doesn't offer compatibility with older browser versions as real CSS3 rules are applied (rather than .animate) but degrades nicely and/or you easily force it to siwtch to the frame-based animation.
Requirements: jQuery
Compatibility: All Modern Browsers
27
Oct
// php the_time('Y') ?>
For any web project, if it is only the animations we need, wouldn't it be nice to use a lightweight framework rather than a complete and big-sized one?
jsMorph is a standalone JavaScript animation framework which can manipulate stylings of multiple HTML elements.
The framework automatically detects start positions, converts units, adjusts rendering speed and corrects time leaks for smoother rendering experience.

It is only 2.3kb, chainable, well-documented (supported with examples) and works pretty fast (with an optimized browser rendering buffer usage).
And, there is a queuing system which allows morphing multiple items.
Requirements: No Requirements
Compatibility: All Major Browsers
31
Aug
// php the_time('Y') ?>
glfx.js is a JavaScript library for applying effects to images using WebGL.
The library has a wide set of built-in-filters including brightness/contrast, curves, sepia, hue/saturation, noise, lens blur, tilt shift, hexagonal pixelate and much more.

glfx.js has 3 parts:
- texture: a raw source of image data (created from an <img> tag)
- filter: an image effect (represents one or more WebGL shaders)
- canvas: an image buffer that stores the results (a WebGL <canvas> tag)
Every filter comes with different variables that can be configured to create custom effects.
Although WebGL is supported by most modern browsers, not by all of them yet (check if your browser supports it).
Requirements: No Requirements
Compatibility: Most Modern Browsers
30
Jun
// php the_time('Y') ?>
Paper.js is an open source and "JavaScript + HTML5 canvas-powered" vector graphics scripting framework.
Besides being a wrapper for the "canvas", it has much more to offer like working with nested layers, groups, paths, compound paths, rasters, symbols, etc.

These items are handled and drawn automatically by Paper.js so you can focus on styling and/or modifying them.
It tries to use the code smartly for faster execution and less CPU usage.
The framework has methods for mouse and keyboard interaction. And, it has the well-known blend modes from Illustrator and Photoshop with JS emulation like: multiply, screen, overlay, soft-light, hard-light, color-burn, darken, lighten, hue, saturation, luminosity, color and more.
Requirements: No Requirements
Compatibility: All Modern Browsers
9
Jun
// php the_time('Y') ?>
Mashi is an open source JavaScript toolkit for creating timeline-based, Flash-like movies and complex animations using HTML, CSS + JS.
It is standalone, modular, object-oriented and lightweight. Additional plugins are only required for advanced usage.
In contrast to other animation tools, Mashi uses a scene-based timeline. So you are not limited to a timeline divided into dozens of equal frames per second but you can split your timeline into self-contained and independent scenes at will.

The toolkit has an automated preloader which loads images used in advance for a better user experience.
Mashi has a "controls" module which provides buttons like "play" and "pause" with their logics and it works in all major browsers including mobile and tablet.
Requirements: No Requirements
Compatibility: All Major Browsers
2
May
// php the_time('Y') ?>
Although images are usually expected to be static elements, customizing them on the client-side (via JavaScript) can be very handy considering the ability to applying effects and changing them anytime while still keeping the original files.
vintageJS is a jQuery plugin that uses the HTML5 <canvas> element for adding a retro feel to images.

It has 3 ready-to-use effects (sepia, green, grayscale) and can be customized very easily by creating new presets with values like vignette, noise, desaturate, viewfinder and more.
The website of the resource also has a web-based editor for applying these effects any image instantly and downloading them.
Requirements: All Modern Browsers
16
Apr
// php the_time('Y') ?>
jQuery.Easie.js is a plugin for the popular JavaScript framework for creating CSS3-like easing animations.
With the help of a web-based drag 'n' drop interface, it enables you to create the easing curve and generates the related jQuery + CSS3 code automatically.

This way, you can use the CSS easing code for supported browsers and the JavaScript code as a fallback.
The plugin is lightweight (2kb) and works pretty fast by using lookup tables.
Requirements: jQuery
Compatibility: All Major Browsers
24
Feb
// php the_time('Y') ?>
CamanJS is a JavaScript image manipulation library that makes use of HTML5 <canvas> tag.
With a simple-to-use interface, advanced filters including saturation, contrast, gamma, brightness or exposure can be applied.

It has a layer system -similar to the ones in Photoshop or GIMP- that creates so many possibilities.
The library can be extended with new plugins and filters where a detailed "how-to" exists on that subject.
CamanJS is standalone, can be safely used with any other JavaScript libraries and also has a NodeJS-compatible version.
Requirements: No Requirements
Compatibility: All Modern Browsers