Unobtrusive Scrolling Ad

I first wrote a scrolling ad script in 2004. JavaScript has changed dramatically since then and so this new unobtrusive scrolling ad script has little in common with that previous one (the code is completely different although the overall result is very similar).

This new scrolling ad script makes use of the $B, $E, and $O objects that provide cross browser code for interacting with the browser, events, and an element in the web page respectively. These three scripts (which have all been included together in dollar.js) are only needed once in your page regardless of how many scripts your page contains that uses them. The actual scrolling ad functionality is relatively small and is set up to allow you to specify an id for your scrolling ad (so it doesn't use one you already have in your page), the width for your scrolling ad, and the content for your ad as three parameters. The ad will pause when the mouse is moved over the ad making it easier for your visitors to interact with it and will start moving again when they move the mouse off of it again. The ad will also disappear if your visitor clicks on the ad or after the ad has gone across the screen and back five times (as if they haven't done anything about the ad by then they are not going to).

Download a complete copy of the Scrolling Ad script. You can then add the script to your page by placing the following immediately before the </body> tag.

<script type="text/javascript" src="dollar.js"></script>
<script type="text/javascript" src="scrollad.js"></script>

You then simply need to update the values at the bottom of scrollad.js to provide a unique id for the ad, the width of the ad, and the ad content. To create multiple ads for use on different pages simply copy scrollad.js and give it a different filename for each different ad.


This article written by Stephen Chapman, Felgall Pty Ltd.

go to top

FaceBook Follow
Twitter Follow