This might be useful for a list of search results where you want the ability to show more images without the distraction of using a full carousel.
How is it made?
::before pseudo-elements are used as hover areas divided, in this case, into fifths and positioned absolutely across the group.
On hover, the z-index of the list-item is set to be lower than those either side of it so they are then available to hover over.
::before psuedo-element of the
<ul> is used to give a safe area in which to hover off so the first image can be seen again.
Tested in the latest versions of Chrome, Firefox, Safari and IE9