How to achieve a lightbox effect with css only? Example available
The website says it doesn't use :target, I looked at the source there is no js as far as i can see so its all just css then ? How . A small fiddle example or an explanation would be very much appreciated.Thanks.
The CSS selector that is being using on the thumbnails is the
:active selectors, which are applied when you click on an anchor (active for IE compatibility, and what you'll see in Firebug).
These selectors simply have the CSS transitions that expand the squashed image to full size, then obviously the
:focus is lost when you click on another element and the lightbox disappears. You can also navigate using the tab keys as in doing so you are just switching the focus between the anchors and thus activating the CSS transitions again.