All pastes #796468 Raw Edit

Continuous marquee

public html v1 · immutable
#796468 ·published 2007-11-25 02:25 UTC
rendered paste body
<html><head>	<title>Marquee for most browsers which don't suck, and Internet Explorer too</title></head><style>.mrq-edge {	display: block;	width: 88px;	height: 31px;	position: absolute;	z-index: 2;	background: #ffd;}.mrq-item {	display: block;	width: 88px;	height: 31px;	z-index: 1;	position: absolute;}</style><script><!-- Yes, it's the old comment trick.mrq_itemcount = 0mrq_itadd = 0mrq_itaddcd = 0mrq_scroll = 0function mrq_additem(style, content){	var s = "<div id=\"mrqi_" + mrq_itemcount + "\" class=\"mrq-item\" style=\"left: 0px; " + style + "\">" + content + "</div>";	document.getElementById("items").innerHTML += s;	mrq_itemcount++}function mrq_getleft(idx){	return parseInt(document.getElementById("mrqi_" + idx).style.left);}function mrq_setleft(idx, l){	document.getElementById("mrqi_" + idx).style.left = l + "px";}function mrq_scroller(){	var i;		for(i=0;i<mrq_itemcount;i++){		a = mrq_getleft(i);		a -= 4;		if(a < 0){			a = 0;		}		mrq_setleft(i, a);	}	mrq_itaddcd -= 4;	mrq_scroll -= 4;	if(mrq_itaddcd <= 0 && (mrq_scroll <= 0 || mrq_itadd != 0)){		mrq_itaddcd = 88;		mrq_setleft(mrq_itadd, 768 - 88);		mrq_itadd++;		if(mrq_itadd == 1){			mrq_scroll = 768 - 88;		}		if(mrq_itadd >= mrq_itemcount){			mrq_itadd = 0;		}	}		setTimeout("mrq_scroller()", 50);}function mrq_init(){	mrq_additem("background: #f77;","FOO");	mrq_additem("background: #7f7;","BAR");	mrq_additem("background: #77f;","FUBER");	mrq_additem("background: #ff7;","ITS");	mrq_additem("background: #f7f;","NOT");	mrq_additem("background: #7ff;","BUTTER");	mrq_additem("background: #f00;","STOP");	mrq_additem("background: #0f0;","HAMMER");	mrq_additem("background: #00f;","TIME");	setTimeout("mrq_scroller()", 50);}// --></script><body onload="mrq_init()">	<div style="border: #ccc solid 2px; width: 768px; height: 31px; position: absolute; left: 0px; top: 0px;">		<div class="mrq-edge" style="left: 0px;"></div>		<div class="mrq-edge" style="right: 0px;"></div>		<div id="items">			<!-- Dynamic addition -->		</div>	</div></body></html>