Plugins

The plugins site is currently in development.

We've been looking to provide a higher-quality, spam-free experience at the plugins site for some time, and a major error on our part forced us to shut down the current site before we could put the new one in place. We are developing a new site, and you can follow along with its development on GitHub. For more information about this transition, including steps you can take as a plugin author to prepare, please read our post about what's going on.

Plugins


1 year 21 weeks ago

A good way to have extra content or a navigation tool in your page!

This jquery component let you easly build a sliding panel where to insert any kind of content; it has builtin all the functionalities for managing menu lines and sub panels with accordion effect. It can get the content via ajax and therefore you can dynamically build it by passing DATA via request using the metadata attribute settable on the extruder container.

demo page:
http://pupunzi.com/#mb.components/mb.extruder/extruder.html

download page:
http://pupunzi.open-lab.com/mb-jquery-components/jquery-mb-extruder/

Dependencies:

  • jquery.hoverIntent.js
  • jquery.metaData.js
  • jquery.mb.flipText.js (soon available as stand alone)
< < < < < < <
1 year 21 weeks ago

This is a powerful component to build easily a multilevel tree menu or a contextual menu (right click) in an intuitive way!

Dependencies:

none

here is the js call:

$(”.myMenu”).buildMenu(
{
  template:”menuVoices.jsp”,
  additionalData:”",
  menuWidth:200,
  openOnRight:false,
  menuSelector: “.menuContainer”,
  iconPath:”ico/”,
  hasImages:true,
  fadeInTime:200,
  fadeOutTime:100,
  adjustLeft:2,
  adjustTop:10,
  opacity:.95,
  shadow:true,
  closeOnMouseOut:true,
  closeAfter:500,
  minZindex:"auto", // or number
  hoverIntent:0, //if you use jquery.hoverIntent.js set this to time in milliseconds; 0= false;

});

or you can call it as contextual menu:


$(document).buildContextualMenu(
{
template:”menuVoices.html”,
menuWidth:200,
overflow:2,
menuSelector: “.menuContainer”,
iconPath:”ico/”,
hasImages:false,
fadeInTime:200,
fadeOutTime:100,
adjustLeft:0,
adjustTop:0,

< < <
2 weeks 6 days ago

AJAX-ZOOM player is a powerful single image zoom & pan viewer with optional gallery extension. It features over 300 other options and can be easily integrated into any website, eCommerce solution or CMS.

AJAX-ZOOM uses image tiles to quickly generate a portion of the zoomed image (similar to Google Maps).

In a special 360° rotation mode it can also be used as object spinner.

Links
Examples
Magento (demo store)
xt:Commerce (xtcModified demo store)
VR Objects 360° (3D Spin & Zoom)
Oxid (demo store)

< < < < < < < < < < <
1 year 22 weeks ago

Jquery collapser is a multi purpose collapser plugin made for expanding and collapsing elements. Can create a accordion, list collapser using this plugin.

Features

  • Very light-weight plugin, fast and simple.
  • Can collapse any element within an document.
  • Can add seperate classes for expanding and collapsing.
  • Customized targeting elements.
  • Callback functions.
  • Predetection of collapsed elements.
  • Can create accordion, list collapsers etc by adding a single additional line.
  • Cross browser supported.
< < < < < < <
1 year 35 weeks ago

jQuery Web Page Content Indexer Plugin is a Auto Content Index creator plugin suited for making automatically created navigation menus with normal content index or a scroller menu style. This plugin is suited for automatically creating content index for WebPages with lots of pages of data.

You can attach the plugin to any elements which you feel is correct as a section header; like H1, H2 etc and this plugin will create a automatic content index menu linked to those sections and embed this menu as a header content index menu or as a scroller menu at the top right side of the web page.

Parameters are provided to control Page Scroll Animations, Menu Style etc.

<
1 year 21 weeks ago

A Radial Menu, also known as a Pie Menu, is a circular contextual menu. The interface is a pretty cool and intuitive one and is now easy to implement on your site!

Radial menu's are powerful primarily because the location of the menu items can be easily memorized by novice users, as well as experienced ones. The interface effectively engages users in a way in which they are capable of placing directional and gestural associations with particular actions; think muscle memory.

< < <
1 year 32 weeks ago

imagineMenu is a jQuery plugin that lets you imagine all your *image menu* problems far away!

Few words about imagineMenu():

< <
2 years 1 week ago

jQuery Menu Style 1

jQuery Menu Features

  • Full cross-browser compatibility
  • Fully accessible even when javascript is turned off, as a pure css menu
  • Search engines optimized
  • Clear unordered list (LI and UL HTML tags) structure of jQuery menu
  • Easy to setup and update
  • Fantastic animation and transition effects
  • Multiple pre-desinded color schemes
  • Completely customizable styling with CSS
  • Powered by jQuery
  • Extremely small - 3kb uncompressed

Color Themes:
(White Smoke) jQuery Menu
(Dim Gray) jQuery Menu
(Black) jQuery Menu

< < < < <
2 years 4 weeks ago

Visual Lightbox is a jQuery plugin for lightbox-style photo galleries and slideshows.

Visual jQuery LightBox Features

  • Slideshow with autostart option
  • Thumbnail and code generator for Windows & MAC
  • XHTML compliant
  • Zoom effect with overlay shadow
  • Rounded corners of overlay window
  • Large images fit to browser window
  • Overlay floating - image floats on scroll staying always visiable
  • Smooth cross-fade transition & animation
  • Image preloading after the page is loaded
  • Keyboard navigation
  • Graceful degradation when javascript is not available
  • A lot of nice gallery themes
< < < < < < < < < <
2 years 11 weeks ago

This plugin allows you to create dynamic, controllable slideshows or presentations for your website.

Simply define a block of HTML to be a slideshow or presentation. You can use any tags like <p>, <img>, <div> etc.

< <
2 years 6 weeks ago

With this JQuery plugin you will be able to create a drop down menu like the one shown in the example below without the need to know JavaScript, only a basic knowledge of HTML and CSS. Documentation is included as a Word document that will guide you through the process of putting a drop down menu on your website. All fonts, colors, sizes and borders are customizable within the CSS.

< <
1 year 22 weeks ago

A full featured image gallery, with nav toolbar, thumbnails, autosize frame.

DEPENDENCIES:
none

HOW DOES IT WORK:

here is the js call:

$(function(){
$('#g1').mbGallery({
         maskBgnd:'#ccc',
         overlayOpacity:.9,
         startFrom: 5
      })
});

here is the code for each image:

<div  id="g1" class="galleryCont">
    <a class="imgThumb" href="gallery1/LR/01.jpg"></a>
    <a class="imgFull" href="gallery1/HR/01.jpg"></a>
    <div class="imgDesc">Description 01</div>
</div>

Params

* containment:“body”, (string) the containment element of the galery
* cssURL:“css/”, (string) the path to css
* skin:“white”, (string) the name of the css file to invoke
* overlayBackground:“#333”, (string) the exhadecimal value of the overlay color
* overlayOpacity:.5 (int) the opacity value of the overlay

< < < < <
2 years 18 weeks ago

A photogallery for extralarge images with navigator.
You can drag your extralarge image in the display by the navigator or the image itself.
Enjoy yourself into images!

dependencies:

jquery.js(1.3)
ui.core.js (1.6rc5)
ui.draggable.js(1.6rc5)

How does it work:

here is the js call:

$(function(){
   $("#navArea").imageNavigator( {
          areaWidth: 700,
          areaHeight:500,
          draggerStyle:"1px dotted red",
          navOpacity:.8
    })
})

here is the code for each image:

<div id="navArea">
<div imageUrl="DSC00844.JPG" navPosition="BR" navWidth="100" style="display:none;" class="imagesContainer">
<span class="title">zuccheriera</span>
<div class="description"><STRONG>description1</STRONG></div>
</div>
[...]
</div>

Params:

areaWidth and areaHeight are the width and the height of the display;

< < < < <
2 years 18 weeks ago

organize your tabs!

A usefull component that let you build a tabbed interface really easily; ad you can sort your tab as you want!

DEPENDENCIES:

ui.core.js
ui.sortable.js

optional:
jquery.metadata.js

HOW DOES IT WORK:

here is the js call:

$("#tabset1").buildMbTabset({
sortable:true,
position:"left",
start:function(){},
stop:function(){}
});

here is the code for each tabset:

<div class="tabset" id="tabset1">
<a id="a" class="tab {container:'cont_1'}">tab 1</a>
<a id="b" class="tab {container:'cont_2'}"  >tab 2 con testo lungo</a>
<a id="c" class="tab disabled {container:'cont_3'}">tab 3</a>
<a id="d" class="tab {container:'cont_4'}" >tab 4</a>
</div>

here is the code for each tabContent:

container 1

container 2

< < < <
2 years 6 weeks ago

jQuery DropDown Menu Style 3

jQuery DropDown Menu Features

  • Cross-browser compatibility
  • Works in browsers with disabled Javascript.
  • Search engines freandly
  • Unordered list (LI and UL HTML tags) structure for menu items
  • Easy to setup and update
  • Awesome animation and transition effects
  • Six pre-desinded color schemes
  • 100% CSS-driven designs.
  • Powered by jQuery
  • Lightweight - 7kb uncompressed
  • Unlimited sub-levels

Color Themes:
(Olive Drab) jQuery DropDown Menu
(Deep Sky Blue) jQuery DropDown Menu

< < < < <
1 year 42 weeks ago

This plugin rotates images in a three dimensional (simulated) carousel. Optionally, all images can have a description element attached to them that pops up on an overlay whenever that image rotates to the center.

To view a better description of the carousel, including all options and examples, visit my website (bkosborne.com).

Tested and works with jQuery version 1.4.2

< < < < < <
1 year 42 weeks ago

This carousel will take a list of any number of images and rotate them out in either a vertical or horizontal fashion, cascading in with a nice simulated 3D effect. Currently only works with images that are the same dimensions. Many options to customize how it operates and looks. View my website for demonstrations and more.

Tested and works with jQuery version 1.4.2

< < < < < < < <
3 years 50 weeks ago

What is this ?

  • This plugin aims to be a collection of snippets that improve accessibility for websites.
  • It also includes a set of "recommendations" coded as tests to improve accessibilty (even beyond javascript).
  • These recommendations can be tested against a page, and get a summary of the results.

How to use it ?

  • First add a call to jquery.js (duh!).
  • Add jquery.accessible.js. This contains the engine for rules/fixes and a set of predefined ones.
  • Right after this, you are ready to run the fixes by calling jQuery.accessible(). You can pass in a hash to specify, with the id and true or false, which ones to run.
    IMPORTANT: don't call this function inside document.ready, call it right away instead.

If you want to run the tests in your page:

  • Add jquery.accessible.validator.js after jquery.accessible.js.
< < < < < < <
4 years 29 weeks ago

Accessible News Slider is a component for viewing news headlines and photos, which is built to be accessible according to WCAG 1.0.

< < < < <
3 years 37 weeks ago

This plugin creates an accordion menu. It works with nested lists, definition lists, or just nested divs. Options are available to specify the structure, if necessary, the active element (to display at first) and to customize animations. The navigation-option automatically activates a part of the accordion based on the current location (URL) of the page.

< < <
3 years 49 weeks ago

A jQuery powered accordion content script. Group contents together and reveal them on demand when the user clicks on headers. Specify whether only one content within the group should be open at any given time, style the headers depending on their content state, and enable persistence so the state of the contents is preserved within a browser session.

A dedicated page showing how to easily create an Accordion Menu using the script (see demo link) is also available.

< <
2 years 41 weeks ago

AJAX javascript tree based jquery,support xml and json
The javascript Tree with checkbox that you need.

Homepage:
http://code.google.com/p/jquery-adubytree/
Blog:
any questions ,you can visite http://blog.163.com/shimingxy/

xml tree load sample

var xmldata ="";
xmldata +="node-1c:";
xmldata += "node-1-1node-1-1";
xmldata += "node-1-2node-1-2";
xmldata += "node-1-3node-1-3";
xmldata += "node-3-1node-3-1";
xmldata += "node-3-1-1node-3-1-1";
xmldata += "node-3-1-2node-3-1-2";
xmldata += "";
xmldata += "node-3-2node-3-2";
xmldata += "";
xmldata +="";

<
1 year 29 weeks ago

New version 1.3 07-24-2010!
Advanced List Rotator 1.3 just released, check the updated home page!

The purpose of Advanced List Rotator is to show each list item for a period of time, then jump to the next using pretty effects. It also utilize a helper list which can act as thumbnails for a gallery or tabs for a banner rotation. By hovering items in the helper list the main list will automatically show the connected item and pause the rotation. Once the user removes the mouse from the item the rotation will continue from that point. But, it can do so much more…

Advanced List Rotator is highly customizable. You can customize effects, timers, class names, start points, randomness, shuffle, user interaction triggers and wether or not the rotation engine should be enabled. This all allows for many fun variants of the plugin. Check out the example page to see some of the possibilities.

< < < < < <
2 years 41 weeks ago

AjaxScroll is an lightweight jQuery plugins . Provided the ajax scollpane to replace the Next/Previous buttons, behaviour similar as MSN Image Search(Live.com Search).

< < < < <
1 year 32 weeks ago

Easily converts your contents into ajax

Dynamically load your content and automatically convert any link to be loaded through ajax, as easy as:



$('#myDiv').ajaxize({url: '/i/want/allthis/ajaxized'});




You supply an URL and the element will be populated with the returned content, and all the links inside will be also handled by Ajaxize so you can forget about typing tons of javascript functions just to accomplish something that could be easier.



Useful when you want to do ajax pagination, image galleries, browsing, etc.



And...

If you want to avoid some links to be handled and loaded through ajax, just apply the "notAjax" class. Example:

<a href="http://google.com" class="notAjax">Google without ajax</a>

< < <
2 years 31 weeks ago

ajaxPager is a jQuery UI widget plugin for building javascript pagers quickly and easily. Each page’s content can be from either a ajax request, a url (iframe), string, element inside the pager, or element outside the pager.

< < < <
2 years 11 weeks ago

Hi Dear,
Mohammad Ebrahim Amini Faravaghi
Thank You For Visit.
--Best Regards

< < < < < < < < < < < < < < < < < < < < <
3 years 37 weeks ago

This script collapses any DIV on the page and lets users manually toggle its appearance via a smooth "Web 2.0 style" animation. Three distinguishing features of this script are:

  1. Ability for the script to work on both DIVs that have an explicit CSS height attribute defined, and without.
  2. Ability to "group" multiple collapsible content instances to act as a single unit, so opening one closes the others.
  3. Persistence can be enabled on each collapsible content individually that will remember if the DIV has been expanded, and upon the user's return to the page within the same browser session, keep it expanded.
  4. Individually toggle various attributes of each collapsible content, whether a fade effect should be applied, the duration of the animation, an explicit height, plus whether the content should be hidden via scripting by default when the page loads.
< < <
1 year 48 weeks ago

Multilevel jQuery Menu with fade and smooth drop-down animation on submenu appearance.

Check live demo: Animated jQuery Menu (White Smoke)

< < < < < < < <
1 year 34 weeks ago

This is an animated table-sort plugin, which can sort on a REGEXP match against a TD's content as well as on its whole content.

To download or see demos, head over to http://mitya.co.uk/scripts/Table-sort---now-REGEXP-friendly-111.

Call it on a table, e.g.

$('#myTable').sortTable(params)

...where params is an object of property/value pairings including:

  • onCol (int, required) - the index of the column in your table to sort on (not zero-indexed)
  • keepRelationships (bool, default: false) - if true, row relationships wil be maintained. That is, the sibling TDs will move also
  • regexp (RegExp, default: null) - a string representing a regular expression (/pattern/) to sort on instead of the complete contents of the TD. Useful with regexpIndex - see below
< < <