Direction-Aware Hover Effect with CSS3 and jQuery
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. ... read more
thumbnails
Thumbnail Proximity Effect with jQuery and CSS3
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 ... read more
CSS3 Lightbox
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 ... read more
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 ... read more
Wave Display Effect with jQuery
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 ... read more
Circle Navigation Effect with CSS3
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 ... read more
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 l ... read more
Multi-level Photo Map
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 ... read more
Responsive Image Gallery with Thumbnail Carousel
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 ... read more
Elastislide – A Responsive jQuery Carousel Plugin
With the responsive awakening in web design it becomes important to not only take care of the visual part of a website but also of the functionality. Elastislide is ... read more
Fullscreen Slideshow with HTML5 Audio and jQuery
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 ... read more
25 Examples of Creative Thumbnail Usage in Web Design
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 ... read more