Re: [css-d] "Lightbox" gallery with CSS

2011-09-13 Thread Philippe Wittenbergh

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  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  keep that focussed state, or does that 
action transfer the focus to the overlay - which then vanishes because the  
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/


Re: [css-d] "Lightbox" gallery with CSS

2011-09-13 Thread Wade Smart
On Tue, Sep 13, 2011 at 14:25, Chetan Crasta  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

2011-09-13 Thread Chetan Crasta
>
>
>>
> 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

2011-09-13 Thread Chetan Crasta
On Wed, Sep 14, 2011 at 12:27 AM, Rachel Mawhood wrote:

> 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/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/