Browser Earthquake!

Author: Dynamic Drive

Last modfied: 10/02/00 (script now allows configuring of just how often the earthquake should occur, in percentage)

Description: Real life earthquakes may induce sheer terror, but browser ones are a whole different story. Using DHTML, we've created an earthquake script that shakes the browser, simulating a quake effect. Use it to grab your visitor's attention, if nothing else. Here are some highlights of this amusing script:

  • The chance that an earthquake will occur is configurable; 100% means every time a visitor enters the page, while 50%, only half of the time.
  • The magnitude of the quake differs randomly during each shake. You could experience an unnoticeable 1-in-rector-scale nudge, or a 10-in-rector monster!
  • Right after the shake, a dynamic message will appear on screen for a few seconds informing the visitor what just happened.
  • The quake script is cross-browser functional- there's no escaping!

Demo: You should have experienced it when entering this page. Reload for another.

Directions Developer's View

Step 1: Insert the following stylesheet into the <head> section of your page:

Select All

Step 2: Add the following code to the <body> section:

Select All

Step 3: Finally, define the below event handler inside the <body> tag itself, like so:

<body onLoad="earthquake()">

Be sure to configure variable "chance_of_occurence" inside script to set how often the earthquake should occur.

Now, let's ready to rumble!

Wordpress Users: Step by Step instructions to add ANY Dynamic Drive script to an entire Wordpress theme or individual Post