Supersized – Full Screen Background/Slideshow jQuery Plugin

So, what exactly does Supersized do? Resizes images to fill browser while maintaining image dimension ratio; cycles Images/backgrounds via slideshow with transitions and preloading; navigation controls allow for pause/play and forward/back

ThickBox 3.1

ThickBox is a webpage UI dialog widget written in JavaScript on top of the jQuery library. Its function is to show a single image, multiple images, inline content, iframed content, or content served through AJAX in a hybrid modal.

Easy Slider 1.7 – Numeric Navigation jQuery Slider

Easy Slider (as I call this plugin) enables images or any content to slide horizontally or vertically on click. It is configurable with css alone. So, basically you link to plugin file, set the content up and style it with css.

jQuery Cycle Plugin

The jQuery Cycle Plugin is a lightweight slideshow plugin. Its implementation is based on the InnerFade Plugin by Torsten Baldes, the Slideshow Plugin by Matt Oakes, and the jqShuffle Plugin by Benjamin Sterling. It supports pause-on-hover, auto-stop, auto-fit, before/after callbacks, click triggers and many transition effects. It also supports, but does not require, the Metadata Plugin and the Easing Plugin.

jQuery Corner Demo

This plugin was originally written by Dave Methvin.
Dave and I collaborated on several improvements and the project is now hosted on github.

JQZoom

JQZoom is a javascript image magnifier built at the top of the popular jQuery javascript framework.jQzoom is a great and a really easy to use script to magnify what you want.

Galleriffic

Galleriffic was inspired by Mike Alsup’s Cycle plugin, but with performance in mind for delivering a high volume of photos. This is my first experiment with jQuery, so I would love feedback on how to improve this plugin. I am not so great at spelling, and it was much later that I realized that the more appropriate spellings would be Gallerific or Gallerrific, but is too late now for a name change, so Galleriffic remains.

jQuery maxImage Plugin

This plugin will resize and scale targeted images to their max width according to the image ratio, the browser size and some simple options. Change the size of your browser to see it’s effect.

Jcrop, the jQuery Image Cropping Plugin

Jcrop is the quick and easy way to add image cropping functionality to your web application. It combines the ease-of-use of a typical jQuery plugin with a powerful cross-platform DHTML cropping engine that is faithful to familiar desktop graphics applications.

jQuery Infinite Carousel Plugin 1.2 Released

An Infinite Carousel Plugin to allow jumping around the sequence of images was the easy part.

Interface Imagebox

Interface Imagebox is an interface plugin for jQuery that allows a nice visualization of images and photos.

jQuery LightBox Plugin

jQuery lightBox plugin is simple, elegant, unobtrusive, no need extra markup and is used to overlay images on the current page through the power and flexibility of jQuery´s selector.
lightBox is a plugin for jQuery. It was inspired in Lightbox JS by Lokesh Dhakar.

piroBox Version 1.1 for jQuery 1.3.1

piroBox jQuery plugin is another plugin in LightBox style.

Animated JavaScript Slideshow

This dynamic JavaScript slideshow is feature packed and under 5KB. It is the long awaited update to my previous script here. A few new features include description support, link support, no naming restrictions, portrait image support, graceful degradation and active thumbnail status. This script was built ground-up and will soon be included at scriptiny where all my scripts will be added as they are updated, debugged and incorporated in the new TINY namespace.

jQuery.popeye 1.0

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.

Sliding Boxes and Captions with jQuery

All of these sliding box animations work on the same basic idea. There is a div tag (.boxgrid in my css) that essentially acts as a window where two other items of your choosing “peek” through.
From this basic idea we can play around with animations of the sliding element to either show or cover up the viewing area, thus creating the sliding effect.

Create a Resizable Image Grid with jQuery

Image grids that smoothly scale at the simple drag of a slider are no longer confined to desktop apps like iPhoto or Picasa. Thanks to some clever CSS and the jQuery UI, fluid image grids are now surprisingly simple to implement on the web.

Animate Curtains Opening with jQuery

This tutorial would not be anything special without the graphics, so let’s make sure you’ve got those under control. They have included the ones used in demo as part of the attached files, now would be a good time to download them if you intend to use them.

Secondly, in addition to the standard jQuery file, they are also using the easing plugin. They have worked with this plugin in previous tutorials but in this case they will use it to provide a bounce effect when the rope is pulled.

BBC Radio 1 Zoom Tabs

How to achieve the effect on the latest BBC Radio 1 website, where the mouse rolls over the image block, tabs slide up and the image zooms a little to reveal more of the picture.

jQuery virtual tour

This is an extension to the simple panorama viewer that allows you to play a little bit more with jQuery by adding interactivity to transform some panoramic views into a virtual tour!

Creating a polaroid photo viewer with CSS3 and jQuery

Italy. A beautiful country that my girlfriend and me visited last year during our summer holiday. While we were there, we took a lot of pictures that would look pretty nice on polaroid.

Placing them on simple polaroids on a webpage simply didn’t do it for me. I wanted to drag them around, rotate them and still have a fun time. That’s were CSS and jQuery come in play. By combining the CSS3 Box Shadow and Rotate properties, this effect is relatively easy to create. When dragging a polaroid around, you’ll see the shadow. When it’s placed down, it’s rotated to the left or the right (random).

Create a unique gallery by using z-index and jQuery

In this tutorial we will combine the CSS property ‘z-index’ and the power of jQuery to create a unique gallery which have a appearance of a pile of pictures.

Make Your Header Responses To Mouse Movements with jParallax

jParallax turns a selected element into a ‘window’, or viewport, and all its children into absolutely positioned layers that can be seen through the viewport. These layers move in response to the mouse, and, depending on their dimensions (and options for layer initialisation), they move by different amounts, in a parallaxy kind of way.

Creating a “Filterable” Portfolio with jQuery

If you have worked in your field for a while, there is a pretty good chance that you have a rather extensive portfolio. To make it a little easier to navigate, you will probably be tempted to break them into different categories. In this tutorial, I will show you how to make “filtering by category” a little more interesting with just a little bit of jQuery.

Slider Gallery

This “product slider” is similar to a straight forward gallery, except that there is a slider to navigate the items, i.e. the bit the user controls to view the items. Simple stuff.

Horizontal Scrolling Menu made with CSS and jQuery

There are a lot of cool flash scrolling menus out there, but I decided to make a similarly looking menu with just CSS and jQuery. I couldn’t achieve the same smoothness in animation, but anyway I’m really satisfied with the result. My menu works fine in all major browsers and degrades gracefully when Javascript is turned off.

Create an Image Rotator with Description (CSS/jQuery)

An image rotator is one great way to display portfolio pieces, eCommerce product images, or even as an image gallery. Although there are many great plugins already, this tutorial will help you understand how the image rotator works and helps you create your own from scratch.

Create a Thumbnail with Fading Caption Using jQuery

Learn how to create another thumbnail effect with fading and transparent caption using jQuery.