This is a nice looking portfolio/image grid with direction aware hover effect. Stylish direction aware hover effect is added using CSS3 and jQuery. The idea is to have a little overlay slide in on top of some thumbnails from the direction that we are coming from with the mouse. When we "leave" the element, the overlay will slide out to that direction, following our mouse. This will create an interesting-looking effect.
Items in the grid can be linked to external resource, if link is not specified, clicking an item will open image in light-box.
This module is built using Java-script, HTML and CSS only. No Flash is used.
Note: Please note, this module requires jQuery 1.7 or higher, please make sure that either your portal has the latest version or you turn on the Include jQuery check-box from module settings page for the first module.
You can review the product terms and license details here.
Module Configuration/Settings:
You can customize the settings for this module, including:
- Randomize Images
- Container Width
- Item Size
- Spacing
- Border
- Border Color
- BG Color
- Text Color
- Text Margin
- Gallery Theme
- Dark Rounded
- Light Rounded
- Dark Square
- Light Square
- Default
- Facebook
- Auto Play
- Auto Play Delay
Browser Support:
Live Demo:
You can access live demo here
Following screenshots describe the functionality of this module:
Module Settings Page:
Manage Images:
Portfolio Grid View:
Hover View:
Gallery View: