This function loops through all images on the page, and serves the appropriately sized image file from a list in a data attribute.
example link: http://total.maloweb.com/responsive
example html:
<img src="default.png" data-widths="400,600,800,1023" data-srcsuffix="-foo.png">
example javascript:
I always found it strange that when you set the font size to 50% in css, letters don't take 50% of the width of the page.
This script makes text behave in that way.
converts canvas image data to a 2d array of booleans
array=img2array(imagedata,width,height)
array[x][y] //gives true or false
very useful for games where you need pixel perfect collision.
Reading an image every time you check for collision is slow. Using a 2d array makes it much faster, and has a very simple syntax (array[x][y]) .