Re: [css-d] Lightbox gallery with CSS
On Wed, Sep 14, 2011 at 12:27 AM, Rachel Mawhood rac...@longitude0.co.ukwrote: Hi list Is it possible to create lightbox effects with images, as on this page (click on any of the images in the main part of the page) http://www.rostock-heute.de/**tag-des-offenen-denkmals-2011-** rostock-staendehaus-**kossfelderstrasse/31597http://www.rostock-heute.de/tag-des-offenen-denkmals-2011-rostock-staendehaus-kossfelderstrasse/31597 using only CSS and no javascript? TVIA Rachel Here is one example: http://www.cssplay.co.uk/menu/css3-keyframe-lightbox.html Regards, Chetan Crasta __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Lightbox gallery with CSS
Here is one example: http://www.cssplay.co.uk/menu/css3-keyframe-lightbox.html Here is another example that works in more browsers: http://www.cssplay.co.uk/menu/lightbox-click.html However, it did not work in Chrome 13 in Linux (could be a browser bug). Regards, Chetan Crasta __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Lightbox gallery with CSS
On Tue, Sep 13, 2011 at 14:25, Chetan Crasta chetancra...@gmail.com wrote: Here is one example: http://www.cssplay.co.uk/menu/css3-keyframe-lightbox.html Here is another example that works in more browsers: http://www.cssplay.co.uk/menu/lightbox-click.html However, it did not work in Chrome 13 in Linux (could be a browser bug). Regards, Chetan Crasta __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ Im on Ubuntu and I can see if you put your mouse over the image and click and hold done the mouse button - it works. Too bad that isnt working better. Wade -- -- Registered Linux User: #480675 Registered Linux Machine: #408606 Linux since June 2005 __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Lightbox gallery with CSS
On Sep 14, 2011, at 4:25 AM, Chetan Crasta wrote: Here is another example that works in more browsers: http://www.cssplay.co.uk/menu/lightbox-click.html However, it did not work in Chrome 13 in Linux (could be a browser bug). I'm not so sure. That page relies on a:active to make the overlay visible. As log a you keep the mouse button down, the whole thing will remain visible – the a will remain in an active state. But release the mouse button, and the overlay vanishes. Of course, one could argue that the a still should remain in a focussed state (in which case the styling still works, as the page author has styled the a:focus to match the a:active state). The question is: does releasing the mouse button when the overlay covers the a keep that focussed state, or does that action transfer the focus to the overlay - which then vanishes because the a is no longer focussed nor 'active' ? That gallery page works more or less OK for the keyboard user, with one (serious) caveat: the user has to cycle through the whole gallery before being able to escape out of the overlay and return to the page. Philippe -- Philippe Wittenbergh http://l-c-n.com/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
