Best jQuery Gallery Plugins & Tutorials with Demo

    rlightbox – a jQuery UI mediabox

    rlightbox – a jQuery UI mediabox

    rlightbox is a jQuery UI mediabox that can display many types of content such as images, YouTube and Vimeo videos. It has many unique features like Panorama and Live Re-size. Like other jQuery UI widgets, it is ThemeRoller ready.

    Lateral On-Scroll Sliding with jQuery

    jQuery On-Scroll Sliding

    After getting the request, we are going to show you how to create a “slide-in on scroll” jQuery effect. You’ve probably seen this cool effect on some websites, like on Nizo or in the portfolio section of brilliantly designed La Moulade. The main idea is to laterally slide in elements depending on the scroll position of the document. Dividing the page into a left and right side, we want to move the elements from “outside” of the page to the center when they are in the viewport. We will also add the option to move the elements in 3D space.

    The theme of today’s tutorial is going to be a timeline where we will have some circular elements on one side and the descriptions on the other. We’ll be alternating the sides to create a random look.

    Exposure – jQuery image gallery plugin

    Exposure - jQuery image gallery plugin

    Exposure is an image viewing plugin for the jQuery JavaScript library. It includes a thumbnail list with paging, shows captions, and has also incorporates full screen modal slideshow. It uses some of the core functionality of Exposure, like keyboard and click through navigation, and also includes a nice and smooth custom cross-fade transition effect.

    Cool Background Image Sliding effect with jQuery

    Cool Background Image Sliding effect with jQuery

    Today I am going to show you how to create sliding image cell effect in jQuery. This is will something like small photo gallery. I prepared 3 demos for you with different effects. Please pay attention that our demo will work in browsers that support used CSS3 properties.

    Slideshowify jQuery plugin for generating a Ken Burns Effect slideshow

    Slideshowify jQuery plugin for generating a Ken Burns Effect slideshow

    Slideshowify is a jQuery plugin for generating a “*Ken Burns Effect”-style slideshow from images that match a selector. Images that don’t fit the window proportions exactly (generally the case) are cropped and panned across the screen.

    jQuery Draggable Image Boxes Grid

    jQuery Draggable Image Boxes Grid

    Today we want to create a template with a fullscreen grid of images and content areas. The idea is to have a draggable grid that shows boxes of thumbnails and menu like items. Once clicked, the thumbnail will expand to the full size image and the menu item box will expand to a fullscreen content area.

    Hover and Click Trigger for Circular Elements with jQuery

    Hover and Click Trigger for Circular Elements with jQuery

    Applying a :hover pseudo-class to an element is widely known as the classic “hovering” over an element on a web page. A problem that arose with the introduction of the border-radius property is the non-realistic triggering of the hover event when entering the bounding box of the element and not just the actual visible area. This becomes extreme when we create a circle by setting the border-radius of a square to 50% (half of its outer width and height).

    Today we want to share one possible solution to the circle hovering problem. We’ll create a plugin that will take care of the ‘mouseenter’, ‘mouseleave’ and ‘click’ events to be triggered only on the circular shape of the element and not its bounding box.

    jQuery Elastic Image Slideshow with Thumbnail Preview

    jQuery Elastic Image Slideshow with Thumbnail Preview

    Today we want to show you how to create a simple elastic slideshow with a thumbnail preview. The slideshow will adjust automatically to its surrounding container and we can navigate through the slides by using the thumbnail previewer or the autoplay slideshow option.

    To make this slideshow responsive, we will use a mixture of JavaScript and CSS techniques.

    Pirobox a jquery lightbox

    Pirobox a jquery lightbox

    Hello and welcome, this is an advanced version of pirobox, I implemented a few things more than the previous version. One of the most important things is the ability to open any kind of files, from inLine content to the swf files, from simple images to pdf files. Other things are: automatic image resizing and drag and drop.

    jQuery Position Absolute

    jQuery Position Absolute

    This nifty little jQuery plugin can make products fit on screen creating an interesting way of displaying them so that they are all visible. Now your days of reducing the size of your images to small thumbnails are over with this fantastic jQuery plugin.