CSS Image Gallery
This is a purely CSS based image gallery that displays larger versions of thumbnail images dynamically when the mouse hovers over them. A rich HTML caption can be added to the enlarged image, and every aspect of the Image Gallery exists as plain HTML on the page. The idea is to use CSS’s “:hover” pseudo class to cause an element to react onMouseover. When that happens, an absolutely positioned container holding the enlarged image, anchored on the page by another container with position set to relative, is shown. Furthermore, it’s possible to modify the behavior so the enlarged images are only shown onClick, though IE6 currently doesn’t support this behavior well. The gallery works in IE6+, Firefox, Opera 8+.
Related Posts :
Just a simple :hover over thumbnail images to give a full size view of each photograph. With al ...
Full Page Image Gallery with jQuery shows us how to create a stunning full page gallery with scr ...
Tutorial on how to create an animated portfolio gallery with jQuery. The gallery will conta ...
This tutorial is about creating a creative gallery with a slider for the thumbnails. The id ...
FrogJS is a simple, unobtrusive javascript gallery. It’s not a replacement for other thumbn ...
Posted on Saturday, September 4th, 2010 at 6:21 am | Category: CSS |
Archives
- December 2010 (327)
- November 2010 (421)
- October 2010 (388)
- September 2010 (628)
- August 2010 (262)