CSSPLAY

CSS DEMOS › A Two Step Photograph Gallery

Date : Pre 2006

For all modern browsers

This demo is too wide for your mobile screen.
Please view on a tablet or PC.

Information

Another simple gallery that does not use thumbnail images. Because all the images are preloaded I have used the full size images as the thumbnails (displaying them at one fifth linear scale).

The first step is the hover which produced a half linear size image, then if you click the hover area it will produce a full size image that will stay on screen until you move your mouse off the gallery and click again.
The next half size image will display on top of the previous full size image, and so on...

Works in IE6, IE7, IE8, Firefox and Opera but Safari(PC) and Google Chrome do not not understand active or focus in the same way as other browsers so do not hold the clicked image on screen.

TUTORIAL

Copyright

Because of all the time and effort spent in producing this demonstration I would ask that you respect my copyright.

1. If you are using this on a personal web site then please retain the copyright comment in the stylesheet.
   A support donation is now required for this demonstration.
2. If you are using this on a commercial web site, or as a paying job for a client, then please email me asking for permission - stu{at}cssplay.co.uk and again a support donation is required.
3. If you are having problems integrating any of my demonstrations into your website then I now offer a service to fault find and correct any errors that you may have introduced. Please email me for more information.