- From: Anselm Hannemann – Novolo Designagentur <anselm@novolo.de>
- Date: Sat, 28 Jan 2012 17:30:46 +0100
- To: Chris Kozlowski <kozlowski.chris@gmail.com>
- Cc: Lev Solntsev <greli@mail.ru>, www-style@w3.org, chris@crunchdesign.com.au
- Message-Id: <FE95C514-1DDA-4A55-933E-3B4B903BC1D2@novolo.de>
Right. I didn't saw the draft but it would only work for non-informational images (for design only). Then the first two options are still open: - responsive images within HTML (not CSS). But then we should change list. This topic will appear shortly in html list, too, when it's approved. -Anselm Am 28.01.2012 um 16:37 schrieb Chris Kozlowski: > Perhaps I'm just not seeing it but I don't think that working draft allows for a responsive image specified by a src attribute in an img tag, eg <img src="resonsive_image.jpg" />. I believe the intent of this is to specify a declarative syntax for referencing an image, the path alias technique I suggested just has the added advantage of being useful in any other place as well. -ck > > On Sat, Jan 28, 2012 at 9:50 AM, Lev Solntsev <greli@mail.ru> wrote: > Anselm Hannemann – Novolo Designagentur <anselm@novolo.de> ïèñàë(à) â ñâî¸ì ïèñüìå Sat, 28 Jan 2012 17:22:37 +0400: > > [Skipped] > > > 3. CSS(4) solution (non-informative content) > > This is how a CSS(4) solution could come up with. It is needed for responsive assets which are only for layout not informational content. And as it’s a mess to work with media-queries on that, there came up another approach from Chris Kozlowski. Here’s the proposed syntax: > Start with a path override (i used $[path]) > > $[myimage.jpg] { > src-xs: min-device-width(320px) max-device-width(640px) url(myimage_xs.jpg); > > src-m: min-device-width(640px) max-device-width(1024px) url(myimage_m.jpg); > > src-xl: min-device-width(1024px) url(myimage_xsl.jpg); > } > using a technique similar to these would result in the images being subject to any preexisting media queries. > in the case that a suitable match cannot be found it would just request the initial "myimage.jpg" > HTML markup need not change just style sheet changes so image would still look like: > you wouldn't have to have to replicate all those attributes in the case of you using myimage.jpg in 15 different img tags > since it is a resource alias, it would implicitly work for background images > all paths would be relative from style sheet (as the always are) > there's the potential to map these into javascript so you could have window.resourceAliases["myimage.jpg"] yield a set of overrides that could be modified (added to and removed from) > > Have you seen the (Last Call) draft of CSS Image Values and Replaced Content Module Level 3? > http://www.w3.org/TR/2012/WD-css3-images-20120112/ > > I believe it already has answers to your requests, especially combined with Media Queries. >
Received on Saturday, 28 January 2012 16:31:13 UTC