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.

thumbnail


$().simplethumbs

Simplethumbs is an easy to use thumbnails script for jQuery for quick thumbnails gallery creation. It also has an autoplay feature for automatic cycling of the images. It is a very basic script, but is easy to configure with 4 callbacks to easily integrate with custom code if needed.

Here's my sample page and some documentation: http://wayfarerweb.com/jquery/plugins/simplethumbs/

Although very lightweight, it is probably all you'll ever need for a thumbnail gallery.

KepResize

This is a verry small image resizer.

Demo on the site.

YouTube video thumbnail/screenshot getter - jYouTube

It takes any YouTube video URL or video ID as first parameter and thumbnail size (big or small) as the second parameter. Utility returns that video’s screenshot URL.

Here is how you use jYouTube plugin in your own code:

// Returns big screenshot by video id
$.jYoutube('rSUfWXcNAOw');

// Returns small thumbnail by YouTube video URL
$.jYoutube('http://www.youtube.com/watch?v=rSUfWXcNAOw', 'small');

jQuery slideShow plugin

Description

From small-scale commercial public sites to large-scale CMS, there are needs of slideshow. Here is a simple and graceful to implement a slideshow based on a short piece of HTML Code in a both unobstructive and pleasant way.

Demo

Inside dev pack, there are two fully functional demos.
A live demo is also available on http://www.elfvision.com. The slide in portfolio makes use of this script.

Requirements

  • jQuery Libary, just download from jQuery Official Site
  • slideView script file. You can download it from below
  • a little knowledge on xhtml and css

Features

This plugin will generate a slideview within the given container based on the data in the HTML document.

The slideview will consist of a group of thumbs, a navigation tool and of course the original images.

(mb)Gallery, another way to present your photo gallery!

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

Thumbnail hover popup

This plugin will display a thumbnail’s larger image like a tooltip when you hover over the thumbnail. This can be used for sites whose thumbnails and larger images have almost the exact same filenames except for one piece that changes between the two. An example is thumbnails ending with "_thumb.jpg" and large images ending with "_large.jpg". You provide the plugin the filename flags for each size and then when users hover over a thumbnail the plugin will create a tooltip and load the large image by swapping the size flags.

I originally made the plugin for Greasemonkey so I could preview larger images on certain sites without having to click to the next page. It also works great when implemented directly on a site. Example sites that use this filenaming convention are flickr, vi.sualize.us, and tinypic.

popeye - an inline lightbox alternative

Popeye generates an inline image gallery from an unordered list of images. The gallery features clever inline image enlargement, i.e. the enlarged image stretches out over the site content without adding a visual overlay of the whole site. It stays fixed with one edge to its original coordinates, so that a sense of cohesiveness is created in the user interface and interaction.

One image with optional caption and image counter will be displayed at a time, and the user can navigate through the entire gallery by clicking buttons that appear on mouseover.