(Site Identification)

'Eye' Focus: Web Support Tutorials

JavaScript: BubbleDrift

Got a page that needs a little extra character? Want a page that has a little more fun? Need a touch that yells 'change' on your page? Then perhaps BubbleDrift will fit your need.

(to Top) Here are some examples you may try:

(Click an image to animate!)

Using BubbleDrift:

A toggle animation link allows the visitor to control the animation. The link appears in the page where you insert the JavaScript defining BubbleDrift's settings.


The reasons that you might wish to use BubbleDrift are numerous, such as focusing attention on: seasons, profession, holidays, celebrations, hobbies, announcements. Just have fun with it.

Easy setup and options:

Here is the code that set's all the options for the script. Each option is labeled with it's purpose. We recommend that you use 5 or less objects for best performance. We further advise that you don't use more than 10 animated objects as the computer processing power needed to animate the objects escalates quickly. (skip code)

<script language="javascript1.2" type="text/javascript"><!--
// Iitialize BubbleDrift (provides a [toggle animation] link so location is important)
n = 5; // number of objects to animate
up = 1; // direction (positive value indicates up, negative for down)
bdsrc = "images/bubble.gif"; // image address
bdlnk = "http://www.melvinwallerjr.com/"; // address of surprise link
bdnm = "'Eye' Focus Home"; // title of surprise link
bdx = 28; // image X dimension (width)
bdy = 40; // image Y dimension (height)
init(n,up,bdsrc,bdlnk,bdnm,bdx,bdy); // start BubbleDrift
// --></script>

From the setting instructions you should notice mention of a surprise link. One of the animated objects have a link and it might be fun to use this as an 'Easter Egg' within your site, linking to a special page. (Remember, you can stop the animation to find the link easier. You do not have to chase the moving objects.)

(to Top) Download it now:

Download BubbleDrift (11.9 kilobyte Zip file).
The BubbleDrift JavaScript, the images, and an example document are included in the file.


[Updated: Sunday, November 18, 2007]