1. Home
  2. Computing & Technology
  3. JavaScript

Spring After the Mouse

1. Introduction

More of this Feature

Head Script Body Script

Attaching a simgle object to follow the mouse around the screen is rather boring unless that object is quite sophisticated itself. To make things more interesting when we have a simple object following the mouse we can set things up so that we have multiple copies of the object following the mouse around and attach them together so that they interact with one another. For this script we will attach the objects together as if they are joined by springs. Because the objects are bouncing around the screen as they follow the moust around the script uses the browser window size and position functions to make sure that all of the objects stay visible on the page.

If you move your mouse around this page you will notice a series of 'O' following the mouse as if thet were attached to it at various points on a spring that has one end attached to the mouse pointer.

I have used 'O' for this example but you can easily substitute whatever you want for each of the objects just by updating what is assigned to the content field in the body script. Any valid HTML can be inserted as the definition of the object that will be repeated along the "spring". You can also change the number of objects by changing numct.

If this is the effect that you want to add to your page then the next step is to obtain the head script.

Sample Page | Obtain the Script | Add to Your Page
Explore JavaScript
About.com Special Features

Holiday Central

What to eat, where to go, fun things to do and how to save money on the perfect gifts. More >

Family Tech Center

Stay connected and entertained with reviews on tips on the latest HDTVs, cellphones and more. More >

  1. Home
  2. Computing & Technology
  3. JavaScript

©2009 About.com, a part of The New York Times Company.

All rights reserved.