5 Fresh and Useful jQuery Plugins were created in November 2009
1. jQSlickWrap
jQSlickWrap is a jQuery plugin which enables you to easily and accurately wrap your text around the content of floated images. It implements a client-side version of the Sliced and Diced Sandbags method of wrapping text around an irregularly-shaped object.
Usage:
It’s as simple as:
$('img').slickWrap();2. jQuery Slider plugin (Safari style)
jQuery Slider is easy to use and multifunctional jQuery plugin. This plugin helps you to build a range slider with Safari Style. This one is really good one!
Usage:Available Options:
* from — [number] left limit
* to — [number] right limit
* step — [number] step of pointer
* round — [number] how many numbers after comma
* heterogeneity — [array] (percentage of place)/(value of place)
* dimension — [string] show this after number
* limits — [boolean] show or not limits
* scale — [array] labels under slider, ‘|’ — show just line
* skin — [string] if you define new skin, just write here his name, in sources defined blue skin for example
3. jQuery Shuffle Plugin
A jQuery plugin for shuffling a set of elements.
Usage:
To shuffle a set of elements use:
$(selector).shuffle();
or
$.shuffle(selector);
4. Flips
Plugin for creating sliding boxes, that allows to show more boxes
on one place. There is arrows to control which box is shown, many
options like speed, auto-change interval, sides, button labels can
be set.
It allows to show multiple columns/rows together
Usage:
$(document).ready(function () {
$('#flips1').after( '<div class="to-flips" id="flips2">' +
$('#flips1').html() + '</div>');
$('#flips1').flips( { autorun_delay:0, direction: 'left' } ); }); 5. JQuery Sprite Animation Plugin
Create quick sprite animation by applying an image and sprite options. You can specify sprite’s options like “frameWidth”, “startFrame”, “endFrame”, “direction” and others. The animation is applied to an element by one line of code. You can use this plugin as an alternative to the “gif” animation, using this plugin you can control your animation behavior from your JaveScript code, like defining the animation delay, having an infinite loop animation or you can specify the number of loops.
Usage:
$(document).ready(function() {
$('#sprite1').spriteAnimation({numberOfLoops: -1,
direction: 'ltr',
startFrame: 0,
endFrame: 36,
interval: 20 }); }); Labels: jQuery
0 Comments:
Post a Comment
Subscribe to Post Comments [Atom]
<< Home