Plugins
Home

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.

background


bgFader

Submitted by jdeerhake on September 23, 2010 - 3:04pm

Plugin to fade a background independently of the element's content. Supports fading in, out, and cross fading.

http://jdeerhake.com/bgFader.php

jQuery Background Parallax

Submitted by sohnee on September 10, 2010 - 1:28pm

The jQuery Background Parallax project is a plugin that causes a background image to scroll at a different speed to content, giving an illusion of depth.

You can set up the background parallax on any scrolling element (such as a div, with overflow set to auto) and it works both horizontally and vertically.

View a demonstration

Read the documentation

jQuery UI Marble

Submitted by ErnestoDK on June 26, 2010 - 5:07pm

The function marble() adds a cut-out marble background to every selected object

To prevent the same boring background, the background-position is
recalculated for every selected object. So each object shows a different
cut-out of the marble plate, which is not repeated, if the background
image is big enough.

For hidden elements random positions are used.

By using a part-transparent background image, the background colour
of an object follows the standard ui-class changes as well.

Usage:

$('.ui-button, #my-button, .any-other-class').marble();

Backgrounder Plugin

Submitted by callmeed on May 19, 2010 - 12:40pm

This is the jQuery Backgrounder plugin. This plugin allows you to fill the background of a page with an image–all while maintaining the aspect ratio and gracefully handling window resizing.

Get the code at: http://github.com/bigfolio/jQuery-Backgrounder

Usage

  • Include jQuery and the plugin file in your page
  • Add a div to your page which includes an image. The div can be set to display:none; if you'd like. I prefer fairly large images but any size will do.
  • Call the backgrounder() function on your div—preferably when the page loads.
  • Use the source of the demo page for guidance.

bgFade

Submitted by jakelauer on May 4, 2010 - 11:00pm

This plugin allows you to duplicate the CSS:hover effect, along with some professional jQuery frosting on top. It's as easy as :hover, but lets you do a whole lot more!

bgFlow

Submitted by hezad on April 3, 2010 - 1:27pm

bgFlow is a jQuery plugin that displays a background image moving with your cursor’s position. Image is loading dynamically and some options let you customize the movement.

Important note : Since this plugin sets the body of the document to “overflow: hidden” to disable scrollbars, it is NOT made for scrollable webpages.

Just Another Corners&Gradients

Submitted by myfreeweb on February 13, 2010 - 3:05pm

A very simple jQuery plugin for creating rounded corners and gradient backgrounds.
Being as native as possible (for example, using SVG corners and gradient on Opera 10.10, CSS corners + SVG gradient on 10.50).
As simple as:
$('#mycoolblock').jacg({'radius': '1em', 'start': '#ffffff', 'end': '#321123'});

Bugs are tracked in Launchpad: https://bugs.launchpad.net/jacg

PhotoShoot Plugin

Submitted by nouall on February 4, 2010 - 4:47am

The jQuery PhotoShoot plugin gives you the ability to convert any div on your web page into a photo shooting effect, complete with a view finder. It provides a number of useful options which enable you to customize the user experience, including blurring, opacity, and a custom onClick function.

Released under MIT.

Shift colors

Submitted by sobi3ch on January 20, 2010 - 7:45am

This plugin can help with easy html element background colors animation (shifting colors). E.g: if we what to animate our #header between black&white colors then we can easy type (remeber that first color comming from css file so we need specified only second one:

$('#header').shiftcolors('#000000');

Second example with speed change (10 seconds):

$('#header').shiftcolors(10000);

Third example with 4 colors & speed change (first color from css):

$('#header').shiftcolors('#000000', '#00ee00', '#ee000', 8000);

Requirements: You need load color plugin first http://plugins.jquery.com/project/color

PanoScroll

Submitted by lord.xeon on January 9, 2010 - 4:10pm

Panorama pictures are really cool looking, except few people have a 9000 px wide monitor to view the whole length of them, and shrinking them down to smaller sizes makes them horrible looking. To fix that use PanoScroll.

It takes the background of a div, and will let you scroll it in any direction, at any speed.

Demos

http://steve.deadlycomputer.com/portfolio/PanoScroll/#demo