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.

flexible


SooperFish Multi-Column Animated Drop-down

SooperFish is an easy to use dropdown-menu plugin with total configuration control and clean code.

Features:

  • Automatic dual or triple columns based on number of child menu items
  • Optional delay before hiding menu on mouse-out
  • Optional automatic indicator arrows (in black or white)
  • Configurable show AND hide animations
  • Custom easing supported
  • Works with jQuery backlava plugin (optionally)
  • Works fine with Javascript disabled
  • Comes with several free themes to demonstrate styling
  • 3.65kb uncompressed
  • 2.01kb minified

For more info check the jQuery SooperFish Blog Post at sooperthemes.com.

This plugin was develope to power the awesome premium Drupal themes at SooperThemes.com.

TopUp

Get TopUp!

TopUp is an absolutely free to use (also for commercial purposes) open-source Lightbox-like library created by Paul Engel. The easiest setup consists of only one(!) include and nothing more! It has an Apple-like design (with Quick Look, Dashboard and Flat Look layouts/themes). As TopUp is unobtrusive, it provides you to keep your HTML code 100% clean.

flexible bbcode editor

This bbcode editor will let you create your own buttons and style them using css to later on assign them to the editor, if you for example don't want to have a bold button you just don't include it in the options.

One key feature in this bbcode editor is the live preview, using regular expression you will get instant preview each time a key is pressed as long as you want to have live preview, the preview contains regular html tags so that you can easily style them with css.

View the home page for a full description.

Flexible accordion

Flexible Accordion

Introduction

This accordion has been design to managed your custom HTML code within unordered lists. All target HTML elements are defined in parameters.

    For example :
  • you can defined your slide titles are 'h3', links or simple 'span'
  • your slide content can be DIVs, SPANs or FIELDSETS
  • a button can be put in the slides to switch to another specific slide

It is so flexible that you should try it to understand the capabilities !

Eniac Essentials Detail Expander

EEDE (Eniac Essentials Detail Expander)

This jQuery plugin is meant to show and hide detail sections in your page, using jQuery. It aims to be extremely flexible and simple in use at the same time.

How it works

  • Create any dom element structure in you page on which the user will click to show an hidden detail-section.
  • Add an attribute called 'detail' to the main element of the clickable section.
  • The value of this attribute must be a css-style jQuery selector that references the element(s) to show and hide.
  • instantiate the detail expander by calling the constructor for theclickable element.

Extra features

  • the constructor will also accept an option called 'speed'. Any speed indicator, accepted by the jQuery animations is valid. (default=slow)
    e.g. "slow", "fast", 0, 1.4

fluwi

Small plugin that:
- takes a div(or any other element) and for specified element class resizes all elements so that they fit to container.
For example:
We have a variable width ul (eg:ul with id = mydiv)
and this ul has a lot of floating(eg:left) li's with a width of lets say 100px.
Normaly if the size of container is let's say 478px, on a row there will be 4 li's(4*100 = 400). It remains a space of 78 pixels width that is empty.
To fill that empty space just resize all li's to have a new width (eg: 478/4).

That's it.
Just include the plugin code in the page an call'it like this:

//The plugin code:

(function($){
$.fn.extend({
fluwi: function(opt){
var variate = ((opt.variate!= undefined)?opt.variate:0);
var contWidth = this.outerWidth();
var boxWidth = opt.minWidth;
var counted = Math.floor(contWidth/boxWidth);
var extra = contWidth-boxWidth*counted;
var eachOne = extra/counted;

Flexify

Flexify is a jQuery plugin which allows web authors to create fluid, full-page, flexible layouts for their web applications. Overlaying the CSS box model, Flexify lets you specify flexible dimensions for content, margin, padding, borders, or position, by taking up all available space on a page. Additionally, Flexify can define whether an elements displays its children vertically (the default) or horizontally, creating rows or columns of elements.

Introduction

Flexify adds the flow and flex functions to jQuery. The former allows you to specify whether an element has vertical or horizontal 'flow', changing the orientation of how its children are displayed. The latter lets you specify which CSS properties should 'flex' and take up all available space.

Example

Using the following page: