Home & blog  /  2010  /  Jul  /  view post  /

Spraycan - vandalise your page

posted: 24 Jul '10 10:13 tags: fun, drawing, Javascript, jQuery

This is what Mitya does when he's bored. This allows you - or rather your site visitors - to take a break from reading your blurb and graffiti your page like it was a wall.

Once the ap starts, you paint by clicking and dragging on the screen. A toolbox allows you to pick the brush colour and size.

Click here to vandalise my homepage. I know, I know. I did tell you I was bored.

Head over here to download, get usage info or view a demo.

The only problem is that clicking and dragging always means selecting text. To my mind there's no way around this apart from in IE (which defines a special text select event, whereas in other browsers you can only return false from the onmouseodwn event - not really an option for a script that listens for mousedown to know when to start painting).

One possible fix would be to append brush strokes to a new, invisible canvass rather than to the itself. Then, during painting, calling event.stopPropagation() would ensure the drag action never made it as far as the body's text elements.

post new comment

Comments (2)

Richard, Leeds, at 23/12/'10 10:48, said: 
If you could save what people had written on your website, and allow your users to add to the vandalism, rather than start from scratch - I bet this would be rather a popular thing to add to a website.

Nice coding.
Mitya, at 23/12/'10 10:53, said: 
Hi Richard - thanks for your comments on my work. The feature you mention would be good, however this would require a fair amount of server-side code. Given that this script was built just as as bit of fun, I didn't think to take it that far. Who knows - I might eventually, unless you or someone else wants to.