jsPlumb is a jQuery plugin that provides a way to “plumb” elements of a UI together. It is much the same way you may have seen on Yahoo Pipes. It uses Canvas in modern browsers and Google’s ExplorerCanvas script for stone-age browsers.

The plugin relies on jQuery 1.3.x or jQuery 1.4.x (tested on 1.3.2 and 1.4.2), and also jQuery UI 1.7.2 (if you want to support dragging). Full transparent support for jQuery dragging is included, the API is super simple, and the compressed version of the script is just 11K.

Nivo Slider is a simple and lightweight (weights only 5kb packed) JQuery Image Slider Plugin that supports up to 9 unique transition effects: sliceDown, sliceDownLeft, sliceUp, sliceUpLeft, sliceUpDown, sliceUpDownLeft, fold, fade, random. You can add your own custom style to the slider including: next/prev arrows, nav bullets, stylesheet. The slider is available for download in 2 versions: Production (5kb Packed) and Development (10kb Uncompressed).

Features include:

• 9 unique transition effects
• Simple clean & valid markup
• Loads of settings to tweak
• Built in directional and control navigation

How to call the plugin?

<script type="text/javascript">
$(window).load(function() {
    $('#slider').nivoSlider({
        effect: 'random',
        slices: 15,
        animSpeed: 500,
        pauseTime: 3000,
        directionNav: true, // Next & Prev
        directionNavHide: true, // Only show on hover
        controlNav: true, // 1,2,3...
        beforeChange: function(){},
        afterChange: function(){}
    });
});
</script>

Famspam is sharing Facebox, a Facebook-style Lightbox useful to display images, DIVs, or entire remote pages using AJAX. The download package comes with the JavaScript and CSS files, a loading image, a close label, four corners, and solid border images.

Implementation Example

1) Load Dependencies – First, you need to load jQuery before Facebox.

<script src="jquery.js" type="text/javascript"></script>
<link href="facebox.css" media="screen" rel="stylesheet" type="text/css"/>
<script src="facebox.js" type="text/javascript"></script>

Read more from this entry…

jQuery Blinds is a simple, effective, and customizable slideshow plugin shared by Little Web Things. It is very easy to install. You just have to put the list (UL) with the images (each LI containg the IMG tag with the right SRC attribute) inside a main class (.slideshow) then call the plugin:

HTML Code

<div class="slideshow">
   <ul>
      <li><img src="lemons/1.jpg" alt="lemon" /></li>
      <li><img src="lemons/2.jpg" alt="lemon tea" /></li>
      <li><img src="lemons/3.jpg" alt="splashing lemon" /></li>
      <li><img src="lemons/4.jpg" alt="salad with lemon" /></li>
      <li><img src="lemons/5.jpg" alt="lemonade!" /></li>
      <li><img src="lemons/6.jpg" alt="sliced lemon" /></li>
      <li><img src="lemons/7.jpg" alt="dripping lemon" /></li>
   </ul>
</div>

Read more from this entry…

gMap is a very flexible and highly customizable jQuery Plugin that helps you embed Google Maps into your website. This lightweight plugin with only 2 Kb in size is available in two versions: compressed and uncompressed. The former is for those who don’t plan to alter the source code and modify the behavior of gMap. The later is intended for developers and is a bit larger in size.

Before using gMap there are just 2 requirements that you need to meet: signup for a Google Maps API key, use the jQuery library 1.3+. This Google Maps script can be customized in many different ways. Many properties can be passed including latitude, longitude, zoom, markers, scroll-wheel, map-type and icon.

mooBarGraph is an AJAX Graph Plugin for MooTools which supports simple bar and stacked bar graphs. This plugin makes graph from your JSON data and is compatible with all major browsers including IE6.

This MooTools script has almost all jqBarGraph possibility, plus some new features such as AJAX data loading, URL bars, info boxes and negative values.

Features include:

• You can set label, color, URL and tooltip text for every bar
• Simple/Stacked Bars
• Legend can be created automatically
• AJAX data loading (can have negative values for simple type)
• Cross-browser compatibility (including IE)

jqFancyTransitions is an easy-to-use jQuery image rotator plugin for displaying your photos as slideslow with fancy transitions effects. After testing many jQuery gallery plugins mostly having just fading and sliding effects, Ivan Lazarevic, decided to make his own slideshow gallery plugin for jQuery.

jqFancyTransitions has many interesting transition effects such as wave, zipper and curtain. There are also options that can be used for custom effect. You can set speed, number of strips, direction, type of effect, etc.

Little Web Things is sharing an easy to use animated countdown script. This is a skinable and an easy to integrate jQuery countdown plugin. The full example features a complete “under construction” page with PHP Backend and 2 skins: light and dark. This script is excellent if you have a product/site to launch and you want to show a timer until the launch date and also capture email addresses to keep people updated. It can also be used when you offer a product discount for a limited time and you want to show how much time is left until your offer expires.

jqBarGraph is an easy to use jQuery plugin for displaying data as bar graphs. The script supports 3 types of bar types: simple, multi and stacked. It doesn’t require any additional stylesheet to work but it can easily styled with CSS.

The data values can be sort either ascending or descending. The position of the graphs can be on ‘top’ or ‘bottom’ (for the simple bar graphs). You can add prefixes and postfixes to the values and also animate the bars (the animation speed can be set in seconds).

The script can be downloaded either unpacked (9.1kb), minified (5.1kb), or packed (4.0kb).

The plugin is tested with jQuery 1.2.3. and jQuery 1.3.2. versions. You are free to use and share this plugin absolutely free.