At a Dutch IT related forum ^[1] there was ever an 1 April joke with some Javascripts (created by the creator of the fabulous DHTML Lemmings ^[2] who's the webdev forum moderator over there) which made all pages instantly been broken up by constantly downfloating mining and exploding lemmings.

Some screens:

It was really awesome. I unfortunately cannot find the original scripts anywhere (I'll however contact him sooner or later), but it should give some ideas :)

Update: he pointed me the location of the script: http://tweakimg.net/g/forum/templates/tweakers/js/l.js It's however specific to Tweakers.net, but it should give sufficient ground for some ideas. Here's a blog ^[3] with some background and explanation how it works.

Have fun!! ;)

document.body.style.MozTransform = 'rotate(180deg)';
document.body.style['-webkit-transform'] = 'rotate(180deg)';

http://www.cornify.com

A semi-related story:

When I left a previous job, I added some code into our homepage so that for one particular user only, after one minute on the site without changing the page, it would "cornify" it. This meant that should she open the site, then go check emails, when she returned it would be covered in rainbows and unicorns, but it wouldn't be immediately obvious what triggered them (and hence, when she went to show someone, it probably wouldn't happen). There was also a built-in 1% chance per pageload that all the text on the site would be switched to color: #f0f (fuchsia).

The bad part of the story was that she showed her husband who figured it must be a virus, so they raced out and paid way too much money for Norton's or something. After that, my successor (who, like everyone else in the company, was aware of the prank) turned off the cornify action, but -- since she actually loved it so much -- left in the 1% chance of fuchsia text.

One tag to rule them all:

<blink></blink>

Give it a "retro" feel. Marque tags with horizontal and vertical scrolling, loudly coloured backgrounds, low-rez animated GIFs galore... And make sure you use the <blink> tag!

oh yeah, and add those stupid animations that follow the cursor everying, like a sparkly unicorn or something awful like that.

Just take a snapshot of the website, and substitute the entire page with just that image. People will try to click everywhere, but no chance :)

Why not simply add a bit of javascript ( digitalBush's hotLinkr ^[1]) to do any of the following:

• cornify - This injects the cornify script from cornify.com and adds sparkle and happiness on 5 second intervals.

• translate - Redirects to a google translated version of the site in Swahili.

• pad - Adds 300px of padding to all divs on the page.

• hasselhoff - Changes all images on the site to reference a picture of David Hasselhoff with puppies.

• overlay - Overlays a transparent div on top of the entires page to prevent interaction with the site.

• flip - Flips all images upside down on the site in IE. Flips the entire page on other browsers.

• move - Picks a direction and moves the margin body in that direction.

• spaz - Jiggles the body margin.

• vroomvroom - Gives the hotlinking site an extra 20hp and 15 ft/lb of torque.

• rickroll - Self explanatory. (If evil)

It's already been written for you. ^[2] All you have to do is edit it.

redirect to http://en.wikipedia.org/wiki/Practical_joke

:)

My favorite website practical joke has always been adding JavaScript to buttons so when you click on a button, instead of performing their actions, the button would move to the other side of the screen. Click on it again and it moves back. You can move around to several different spots.

Rotating the entire web page would be fun using CSS Matrix Rotations ^[1].

We have a comment feature on the site, and I'm looking for a fun way to prevent folks from commenting during this day of mayhem. I'm considering trying to move the "comment" button to a different location on the page when moused over, to prevent the user from ever actually clicking.

Animated characters (using GIF or something) walking across the screen. Or maybe a ghost that jumps at you suddenly :)

Use the text shadow tag and some fun coloring options in CSS to make everything in 3D! Find some cheap 3D glasses and start handing them out to people but not inform them why (probably mention something about the importance of them so they just don't go throw them away...).

EDIT: If you wanted to keep it simple, since hyperlinks are usually blue I'll assume yours are, so just add the following CSS code. Not positive if text shadow is supported in all browsers... I just did it in Firefox.

a { text-shadow: 2px -2px red };

But yeah I don't know how cheap even some cheap 3D glasses would be. Still it'd be kinda funny just to put out there. I think most people would get the joke even without the glasses.

Make every link go to a Rickroll video on Youtube! Oh the fun things that would ensue...

Put everything in <marquee> tags. Or make everything fall to the ground like this: http://www.chromeexperiments.com/detail/gravity/.