Re: An error pseudoselector for media

This is something I've mentioned before and would like to see. Its desirable to have different fallback styling if images dont load.

Good example is a graphic-replaced logo. Instead of having to overlay a span with a bg image the css could do it itself. This would be better in all regards because with logos that have transparency you cant always use the span trick without having html words poking through.

Sent from my iPhone

On 3 Feb 2012, at 06:57, Charles Pritchard <chuck@jumis.com> wrote:

> It occurred to me this evening, as I was chatting on webapps about createObjectURL, that an error pseudoselector for image elements would be darn handy.
> 
> I had to use JavaScript for my project recently, because my primary image is a PNG but I've embedded an SVG resource as a fallback.
> Well, my primary image is an SVG at a separate url, and my fallback is an embedded SVG... but the point remains.
> 
> It'd be swell to have something like this
> 
> #myImage::error {
> content: url(#fallback);
> }
> 
> <img src="howdy.png" />
> <svg id="fallback" />
> 
> I know that there are some vendor specific selectors that touch the periphery of this case.
> They're mostly about handling the image-broken visualization.
> 
> onerror does not succumb to issues of CORS, so it seems quite safe to use it as a semantic with CSS.
> Further, it's possible that an error will occur at any time, such as a low memory condition.
> 
> That's something that JS is not so awesome at handling.
> 
> -Charles
>

Received on Friday, 3 February 2012 08:08:20 UTC