Bounce Style Marquee Script

You can use this script as a cross-browser replacement for IE's built-in MARQUEE tag (which doesn't work in anything except IE).

Instructions:

1: Copy and paste the following Javascript in the BODY section of your page:
Select all...

<script language="javascript">
/*******************************************
Bounce Scroller (Marquee Bounce Replacement) v-1.1
Brian Gosselin - http://scritpasylum.com

Version notes:
V-1.0: Initial release.
V-1.1: Removed the need to hardcode the element's width.
       The script now does this for you.
*******************************************/

//ENTER CONTENT TO SCROLL BELOW.
var content='Adjust the various settings in the script to get the effect you want.<br>The "boxwidth" setting should be set wide enough for the content to bounce.';

var boxheight=35;        // BACKGROUND BOX HEIGHT IN PIXELS.
var boxwidth=500;        // BACKGROUND BOX WIDTH IN PIXELS.
var boxcolor="#ffedcf";  // BACKGROUND BOX COLOR.
var speed=30;            // SPEED OF SCROLL IN MILLISECONDS (1 SECOND=1000 MILLISECONDS)..
var pixelstep=1;         // PIXELS "STEPS" PER REPITITION.

//** DO NOT EDIT BEYOND THIS POINT **
var outer, inner, elementwidth;
var goingright=true;
var w3c=(document.getElementById)?true:false;
var ns4=(document.layers)?true:false;
var ie4=(document.all && !w3c)?true:false;
var ie5=(document.all && w3c)?true:false;
var ns6=(w3c && navigator.appName.indexOf("Netscape")>=0)?true:false;

function getElWidth(el){
if(ns4)return (el.document.width)? el.document.width : el.clip.right-el.clip.left;
else if(ie4||ie5)return (el.style.width)? el.style.width:el.clientWidth;
else if(w3c)return (el.style.width)?parseInt(el.style.width):parseInt(el.offsetWidth);
else return -1;
}
var txt='';
if(ns4){
txt+='<table border=0 cellpadding=0 cellspacing=0  width='+boxwidth+' height='+boxheight+'><tr><td>';
txt+='<ilayer name="outer" bgcolor="'+boxcolor+'" visibility="visible" width="'+boxwidth+'" height="'+boxheight+'" clip="'+boxheight+'">';
txt+='<layer  name="inner" visibility="hidden" left="2" top="2">';
txt+=content;
txt+='</layer></ilayer></td></tr></table>';
}else{
txt+='<div id="outer" style="position:relative; width:'+boxwidth+'; height:'+boxheight+'; visibility:visible; background-color:'+boxcolor+'; overflow:hidden; text-align:left" >';
txt+='<div id="inner"  style="position:absolute; visibility:hidden; left:2px; top:2px; overflow:hidden">';
txt+=content;
txt+='</div></div>';
}
document.write(txt);

function init(){
inner=(ns4)?document.layers['outer'].document.layers['inner']:(ie4)?document.all['inner']:document.getElementById('inner');
elementwidth=Math.min(boxwidth-4,getElWidth(inner));
if(ns4){
document.layers['outer'].clip.height=boxheight;
document.layers['outer'].clip.width=boxwidth;
inner.clip.width=elementwidth;
inner.clip.height=boxheight-4;
inner.visibility="show";
}else{
inner.style.clip='rect(0px, '+elementwidth+'px, '+(boxheight-4)+'px, 0px)';
inner.style.visibility="visible";
}
goingright=true;
setInterval('bouncescroll()',speed);
}

function bouncescroll(){
if(ns4){
if(inner.left>=(boxwidth-elementwidth))goingright=false;
if(inner.left<=2)goingright=true;
inner.left=(goingright)?inner.left+pixelstep :inner.left-pixelstep;
}else{
if(parseInt(inner.style.left)>=(boxwidth-elementwidth))goingright=false;
if(parseInt(inner.style.left)<=2)goingright=true;
inner.style.left=((goingright)? parseInt(inner.style.left)+pixelstep: parseInt(inner.style.left)-pixelstep)+'px';
}}

window.onload=init;
</script>

2: Edit the content string and adjust the settings in the script to suit your taste.