Really? An empty div element? What about accessibility or When CSS cannot be loaded? What if only html is grabbed by another page? It doesn't seem to be a really solid solution in my opinion.
---- Anselm > On 12 Nov 2013, at 19:40, "Tab Atkins Jr." <jackalm...@gmail.com> wrote: > >> On Tue, Nov 12, 2013 at 9:50 AM, Adam Barth <w...@adambarth.com> wrote: >> We might even be able to make this work without inventing anything: >> >> <style type="text/css"> >> @media (min-width: 480px) { >> .artdirected { >> width: 30px; >> height: 30px; >> background-image: image-set(url(small.png) 1x, url(small-hires.png) 2x); >> } >> } >> @media (min-width: 600px) { >> .artdirected { >> width: 60px; >> height: 60px; >> background-image: image-set(url(large.png) 1x, url(large-hires.png) 2x); >> } >> } >> </style> >> <div class="artdirected"></div> >> >> All the information is there. We just need to teach the preload >> scanner to parse a subset of CSS and match a subset of selectors. If >> you stay within the "preloadable" subset, then your images will be >> loaded by the preload scanner. Otherwise, they'll just be loaded >> normally. >> >> What's most attractive to me about this approach is that it doesn't >> require inventing anything new, which means the compatibility story >> for older user agents is solid. You don't need a polyfill or anything >> like that. > > If you legitimately think this will work, I'm for it. If you just > think it's a vague "maybe", I'd like to continue pursuing new syntax. > > (If we do this, we just need to port the variable-sized-image stuff > into image-set(). It wouldn't be hard.) > > ~TJ