StackSlider: A Fun 3D Image Slider
By Pedro Botelho on
An experimental image slider that flips through images in 3D. Two stacks resemble image piles where images will be lifted off from and rotated to the center for view ...
thumbnails
Adaptive Thumbnail Pile Effect with Automatic Grouping
By Pedro Botelho on
An experimental jQuery plugin that will group thumbnails by a shared data-attribute into a pile. When clicking on the pile, the thumbnails that belong to that pile w ...
Unfolding 3D Thumbnails Concept
By Mary Lou on
A 3D thumbnail view concept for image slideshows: the current image gets opened up and a thumbnail view unfolds in 3d. ...
Animated Responsive Image Grid
By Mary Lou on
A jQuery plugin for creating a responsive image grid that will switch images using different animations and timings. This can work nicely as a background or decorati ...
Photo Booth Strips with Lightbox
By Mary Lou on
A tutorial about how to create some neat scrollable photo booth strips and integrate Lightbox 2 and customize it in order to make it responsive and touch-device fr ...
3D Thumbnail Hover Effects
By Mary Lou on
A tutorial about how to create 3D thumbnail hover effects with CSS 3D transforms and jQuery. ...
Direction-Aware Hover Effect with CSS3 and jQuery
By Mary Lou on
How to create a direction-aware hover effect using CSS3 and jQuery. The idea is to slide in an overlay from the direction we are moving with the mouse. ...
Thumbnail Proximity Effect with jQuery and CSS3
By Mary Lou on
Today we want to show you how to create a neat thumbnail proximity effect with jQuery. The idea is to scale thumbnails when hovering over them and also scale their n ...
CSS3 Lightbox
By Mary Lou on
Today we want to show you how to create a neat lightbox effect using only CSS. The idea is to have some thumbnails that are clickable, and once clicked, the respecti ...
Elastic Image Slideshow with Thumbnail Preview
By Mary Lou on
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 ...
Wave Display Effect with jQuery
By Mary Lou on
How cool is it to sometimes just display content a little bit differently? Today we want to share an experiment with you that let's you show images and content in a ...
Circle Navigation Effect with CSS3
By Mary Lou on
Today we want to show you how to create a beautiful hover effect for an image navigation using CSS3. The idea is to expand a circular navigation with an arrow and ma ...
Draggable Image Boxes Grid
By Mary Lou on
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 l ...
Multi-level Photo Map
By Pedro Botelho on
This multi-level map based image gallery makes it possible to show images related to their location. The first level indicates the location of the places where each ...
Responsive Image Gallery with Thumbnail Carousel
By Mary Lou on
A tutorial on how to create a responsive image gallery with a thumbnail carousel using Elastislide. Inspired by Twitter's "user gallery" and upon a request to show a ...
Elastislide – A Responsive jQuery Carousel Plugin
By Mary Lou on
Elastislide is a responsive image carousel that will adapt fluidly in a layout. It is a jQuery plugin that can be laid out horizontally or vertically with a pre-defi ...
Fullscreen Slideshow with HTML5 Audio and jQuery
By Jay Salvat on
In today’s tutorial we'll create a fullscreen photo slideshow to illustrate a New York picture series. We will add sounds with the HTML5 audio element in order to ...
25 Examples of Creative Thumbnail Usage in Web Design
By Gisele Muller on
Wikipedia tells us that "thumbnails are reduced-size versions of pictures, used to help in recognizing and organizing them, serving the same role for images as a nor ...
Grid Navigation Effects with jQuery
By Mary Lou on
Today we want to share some neat grid navigation effects using jQuery. In our examples we will show you ten ways how to navigate through a set of thumbnails. We'll t ...
Image Wall with jQuery
By Mary Lou on
Today we want to show you how to create a neat image wall with jQuery. The idea is to scatter some thumbnails with different sizes on the page and make a ribbon slid ...
3D Wall Gallery
By Mary Lou on
Today we want to share our latest experiment with you: the 3D Wall Gallery. Using the Safari browser the images of this gallery will be put into 3D perspective, when ...
Thumbnails Preview Slider with jQuery
By Mary Lou on
In this tutorial we will show you how to create and use a thumbnails preview slider with jQuery. Since we got a lot of requests to show how to make the preview slide ...
Sweet Thumbnails Preview Gallery
By Mary Lou on
In this tutorial we will create an image gallery with jQuery that shows a preview of each image as a little thumbnail. The idea is to hover over the slider dots and ...
Slider Gallery with jQuery
By Mary Lou on
This tutorial is about creating a creative gallery with a slider for the thumbnails. The idea is to have an expanding thumbnails area which opens once an album is ch ...