JS Image

I can’t see much practical value for this, but it turns out that in Firefox you can use a JavaScript function as the value of a src attribute. For example:

<script type="text/javascript">

function js_img() {

 var img = "\x47\x49\x46\x38\x39\x61\x0f\x00\x0f\x00" +
  "\xb3\x0c\x00\xff\xea\x00\x45\x45\x45\x00" +
  "\x00\x00\xff\xce\x00\xff\xc9\x00\xfe\x9d" +
  "\x00\xff\xb4\x00\xff\xfe\x93\xff\xfd\x13" +
  "\xff\xff\xc7\xff\xe5\x00\xff\xff\xeb\x00" +
  "\x00\x00\x00\x00\x00\x00\x00\x00\x00\x00" +
  "\x00\x21\xf9\x04\x01\x00\x00\x0c\x00\x2c" +
  "\x00\x00\x00\x00\x0f\x00\x0f\x00\x00\x04" +
  "\x58\x90\x49\x19\x6a\x9d\x98\xd5\x95\xce" +
  "\x19\x17\x16\x70\x08\x02\x9c\x43\x11\x4c" +
  "\x41\x27\x9c\xb0\x90\xae\xda\xf1\xc2\x31" +
  "\xa8\x25\x26\x70\xfb\x27\x82\x2a\x70\xe8" +
  "\xfd\x6e\x04\x43\xe5\x80\x6b\x02\x92\x95" +
  "\x9e\x33\xa8\x0c\x0c\xa6\x27\x85\x70\x65" +
  "\x3d\x09\xbe\xdf\xa7\x4e\x33\x18\xfc\x00" +
  "\x0a\x99\x8a\x55\x26\xb8\xdd\xb3\x4c\xc5" +
  "\x40\x37\x0c\x33\x2c\x0b\x6d\x12\x01\x00" +
  "\x3b";

 return img;
}
</script>

<img src="javascript:js_img();" alt="JS image" />

In Firefox that looks like a sad face; everywhere else it doesn’t work. (The Firefox behaviour is probably a bug rather than a feature, but still.) Voilà!

JS image

Update: turns out that XBM images work in IE. (Thanks Turnip!) Unfortunately, it’s the only format that does, and it’s black and white only. The hack dates back to Netscape 2, apparently.
Update 2: in Mozilla, see also the data: protocol.

   
This entry was posted on Saturday, March 5th, 2005, in the categories “”, “JavaScript”, “Firefox”, “code” and “hacks”.
Move this content to the main column. →

Thus far, 2 responses.

Recorded Turnip:
March 12th, 2005 at 6:04 am

You think that’s cool? Try this: http://www.the5k.org/description.asp/entry_id=946 ;-)

It works in IE too, so there must be a way.

Answered random:
March 12th, 2005 at 10:35 am

Thanks for the link. I’d seen it, but didn’t think of it when I wrote this. The only difference is that the Wolf3d script outputs an XBM-format bitmap, and here I’m using GIF. One works in IE, the other doesn’t.

Hopefully other (colour!) formats will work too…

Leave a Reply