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.

resize


jfilemanager

Submitted by sevy on October 7, 2010 - 2:46pm

Display, select, delete, upload, duplicate your files. Resize, crop your images.
Insert your images in tinymce.

JJDataGrid

Submitted by alphaworks on September 21, 2010 - 1:27am

Scrollable table with resizable columns and selectable rows. With this plugin, you can make your table scrollable both vertically and horizontally. Columns can be resizable and rows can be selected.

ae Image Resize

Submitted by AdeelEjaz on June 25, 2010 - 5:31pm

aeImageResize is a jQuery plugin to dynamically resize the images without distorting the proportions. The plugin automatically works out how to resize the image so it fits in the dimensions passed.

Example

<script>
$(function() {
$(".resizeme").aeImageResize({height: 200, width: 250});
});
</script>

<img src="./sample1.jpg" class=resizeme>
<img src="./sample2.jpg" class=resizeme>

Image Scale Plugin

Submitted by harshalj on April 27, 2010 - 10:51pm

Uses the code from http://ditio.net/2010/01/02/jquery-image-resize-plugin/ to scale images and then injects a div in the DOM to show as a Tool-Tip (top left corner) on the image upon hover - this tooltip contains a link to the original full sized image. See a screenshot of the tooltip here: http://img72.imageshack.us/img72/6397/jqueryimagescale.jpg

Usage example:

$(document).ready(function () {
$("body img").imageScale({ maxWidth: 1000 });
});

Document Resize Event Plugin

Submitted by kayahr on April 26, 2010 - 10:23am

This plugin introduces a new Event: $(document).resize(). The document size is checked each second and the event is triggered if the size has changed. Additionally this check does the same with the window size and the window scroll position because in many situations browsers do not send the appropriate events.

Stretch

Submitted by tixxit on March 30, 2010 - 11:27pm

Stretch is a jQuery plugin to resize text so that it fills up the full width of its container. It does this in a 2 step process:

  1. It finds the largest font size (aligned on a pixel) that can be contained by the container without overflow;
  2. It finds the maximum amount of word-spacing that can be added without overflow.

There is a similar plugin (TextFill), however it doesn’t allow the text to be taller than the initial height, requires a maximum font size to be given and is non-optimal (performs a O(n) search, n is the font-size of the final chosen size). This plugin remedies some of these problems. It does not consider the height during the resizing, always fills to the maximum width (font will be whatever size gets to this width), and runs in O(log n) time. However, it only considers width, not height.

jQuery resize event

Submitted by Ben Alman on February 10, 2010 - 10:59pm

With jQuery resize event, you can now bind resize event handlers to elements other than window, for super-awesome-resizing-greatness!

Long ago, the powers-that-be decided that the resize event would only fire on the browser's window object. Unfortunately, that means that if you want to know when another element has resized, you need to manually test its width and height, periodically, for changes. While this plugin doesn't do anything fancy internally to obviate that approach, the interface it provides for binding the event is exactly the same as what's already there for window.

Full documentation, source, and examples are available on benalman.com.

jQuery Iframe Resizer

Submitted by sroucheray on February 9, 2010 - 5:29am

Helps to resize iframes included in a webpage.
* Automatically resizes iframes height depending on their content
* Sets multiple iframes size in one line of code

var options = {
        width: "fill",
//width options are :
//'fill' (default, equivalent to 100%),
//any valid CSS unit : '90%', '230px', '12em'
        height: "auto", //height options are :
//'auto' (default, will adapt iframe height to its content, the more content, the higher)
//any valid CSS unit : '90%', '230px', '12em'
        autoUpdate : true
// 'true' (default, automatically update iframe height on content changes in the future) or 'false'

};
$("body").iframeResize(options);

YouTube Embedded Video Resizer

Submitted by fitztrev on December 17, 2009 - 12:14pm

This jQuery plugin will automatically resize all of your YouTube video embeds to fill their container's width. The width-height proportion will be maintained.

Often a YouTube video, when embedded on your site, will only take up a portion of the visible space available. This gets rid of any manual work you might have to go through to resize the video correctly.

Fullscreenr - lightweight full screen background plugin

Submitted by nanotux on November 29, 2009 - 9:57am

So you want to have a background image on your website, which always fills the screen and maintains its aspect ratio? And it has to be centered, instead of focussing at the top left corner of the image?

It is possible with jQuery and the fullscreenr plugin on this page! You can find a demonstration here and as you can see it works perfectly in all javascript enabled browsers. Note that Internet Explorer needs some extra code to enable the transparent png used for the raster over the background image. If you want to add this code I would like to refer you to unitpngfix, but of course you could just not support IE6.

The code is quite self explanatory, and I’ve included comments where necessary.