4 ms·
Neat that you can do that. Not a technique that I'd ever want to use.
by Semiapies 16y ago
Neat that you can do that. Not a technique that I'd ever want to use.
- ronaldj 16y agoWhy not?
- atlbeer 16y agoBecause it breaks the paradigm of HTML = Content CSS = Style / Design JS = Interaction Once you start to mix them up you start down a hair path
- thevivekpandey 16y agoLightbox functionality encompasses the JS domain (since user is interacting with the page) as well as CSS domain (since the change that is happening on the page is purely of style/design). So, the breakup which you have given does not unequivocally argue for the use of JS.
- Semiapies 16y agoIt argues more for JS than CSS.
- Semiapies 16y agoMinor reasons: less performant than Javascript solutions (the transition is sluggish and jittery in Chrome for me) and the fact that I have to click a little target to shrink it back, whereas most Javascript solutions will let me hit Escape or click elsewhere on the page to shrink it back. Major reason: Separation of concerns: CSS is for appearance, Javascript is for behavior. They don't work well trying to do the other's job. This is touched on by the shrinking problem I mentioned above - it's easy to watch more events to make the behavior of Javascript functionality more flexible or more user-friendly, but not so much in CSS. That said, it's a toy demonstration of transitions; it's cool that the bear dances, even if I wouldn't take him on Dancing with the Stars.
- thevivekpandey 16y agoI also noted the sluggishness that you point out. Do you know the reason? Is it something that could be corrected by changing some parameter in the CSS?
- Semiapies 16y agoNot entirely sure. The animation speed might be adjustable, but the jitteriness is probably due to browser support (or earliness thereof).
- thevivekpandey 16y agoI think I would like to use it. I consider lightbox functionality to be related to the layout of the content, and hence logically a part of CSS rather than javascript. In CSS3 world, I like to use javascript for the tasks not related to the layout: such as making ajax queries, manipulating user inputted data, etc. Is there a case for relying on javascript for functionality such as lightbox?
- Semiapies 16y agoWhy would lightbox functionality or any other animation and interaction be part of "layout"?
- thevivekpandey 16y agoI am unable to make up my mind here. As atlbeer says, following is the standard breakup of responsibilities: - HTML = Content - CSS = Style / Design - JS = Interaction As argued elsewhere, lightbox straddles JS and CSS domains. I was thinking that in CSS3 world, we should have slightly different breakup of responsibilities (subject to resolving performance issues) - HTML = Content - CSS3 = style/design and changes in style/design - JS = interaction other than purely style/design changes I see that this breakup may lead to confusion in some situations. (Though I still find it more appealing for lightbox example) So, let me make up my mind when I have more experience with CSS3 :-)
- Semiapies 16y agoFair enough!
- aditya42 16y agoIf you want to do something other than show a bigger version of an image (like fetch extra data about it for captions), just CSS won't cut it. Remember that "lightbox" isn't just the effect, it's a UI control.