Cursor Scroller

Cursor Scroller
This floating scroller follows your cursor like a dog. Add as many messages as you like. True copy-and-paste installation. Easy configuration of messages, scrollersize, font, fontcolor, fontsize, backgroundcolor, borderwidth, TIME OF VISIBILITY and speed IE5x/6x/7x/8x, FF2x/3x/4x, Opera 6x/7x/8x/9x/10x, Chrome 3x/4x.

Move your mouse to see the floating effect! The scroller will disappear after 20 seconds. The time of scroller-visibility can be changed easy!

Configuration:

Step 1: Open your webpage and paste the following code right above the </BODY> tag:

<SCRIPT>
// CREDITS:
// Cursor Scroller
// by Peter Gehrig 
// Copyright (c) 2010 Peter Gehrig. All rights reserved.
// Permission given to use the script provided that this notice remains as is.
// Additional scripts can be found at http://www.fabulant.com.

// IMPORTANT: 
// If you add this script to a script-library or script-archive 
// you have to add a link to http://www.fabulant.com on the webpage 
// where the scrips will be running.

// EDIT THE VARIABLES BELOW: /////////////////////////

// your messages, add as many messages as you like
var message=new Array("Did you order your free brand T-Shirt?","Also you should test our free webtools as well as our scripts!", "They will attract more visitors and enhance the impact of your webpage.")

// color of the messages
var messagecolor="black"

// how many seconds shall the scroller be visible? 
var stoptime=20

// width of scroller (pixels)
var scrollerwidth=200

// height of scroller (pixels)
var scrollerheight=18

// speed 1: lower means faster
var pause=20

// speed 2: higher means faster
var step=1

// font-size of messages
var fntsize=10

// font-family of messages
var fntfamily="Verdana"

// font-weight: 1 means bold, 0 means normal
var fntweight=1

// backgroundcolor of scroller
var backgroundcolor="#FFFF00"

// borderwidth of scroller (pixels)
var borderwidth=1

// width of scrollerpadding (pixels)
var cellpad=5

// DO NOT EDIT THE VARIABLES BELOW: /////////////////////////
var starttime
var nowtime
var stoptime
var timetohidescroller=false
var textmovedtoleft=0
var ns6=document.getElementById&&!document.all?1:0 
var x=-1000
var y=0
var scrollerleft
var scrollertop
var screenwidth
var clipleft,clipright,cliptop,clipbottom
var i_message=0
var timer
var textwidth
var textcontent=""
var bgcontent=""
if (fntweight==1) {fntweight="700"}
else {fntweight="100"}

function init() {
	getbgcontent()
	gettextcontent()
	startnewtime()
	scrollertop=y
	scrollerleft=x
	text.innerHTML=textcontent
	bgscroller.innerHTML=bgcontent
	textwidth=text.offsetWidth
	document.getElementById("bgscroller").style.top=parseInt(scrollertop-cellpad)
    document.getElementById("bgscroller").style.left=parseInt(scrollerleft-cellpad)
	document.getElementById("text").style.top=parseInt(scrollertop)
    document.getElementById("text").style.left=parseInt(scrollerleft+scrollerwidth)
	clipleft=0
	clipright=0
	cliptop=0
	clipbottom=scrollerheight
	document.getElementById("text").style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
    scrolltext()
}

function scrolltext() {
	if (parseInt(document.getElementById("text").style.left)>=scrollerleft-textwidth) {
		textmovedtoleft+=step
		document.getElementById("text").style.left=parseInt((scrollerleft+scrollerwidth)-textmovedtoleft)
		clipright+=step
		if (clipright>scrollerwidth) {
			clipleft+=step
		}
		document.getElementById("text").style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
		scrollertop=y
		scrollerleft=x
		document.getElementById("bgscroller").style.top=parseInt(scrollertop-cellpad)
        document.getElementById("bgscroller").style.left=parseInt(scrollerleft-cellpad)
		document.getElementById("text").style.top=parseInt(scrollertop)
		var timer=setTimeout("scrolltext()",pause)
		}
	else {
		changetext()
	}
}

function changetext() {
    i_message++
	if (i_message>message.length-1) {i_message=0}
	gettextcontent()
	text.innerHTML=textcontent
	textwidth=text.offsetWidth
   	document.getElementById("text").style.left=parseInt(x+scrollerwidth)
	textmovedtoleft=0
	clipleft=0
	clipright=0
	document.getElementById("text").style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
	checktime()
	if (!timetohidescroller) {scrolltext()}
	else {hidescroller()}
}

function gettextcontent() {
	textcontent="<span style='position:relative;font-size:"+fntsize+"pt;font-family:"+fntfamily+";font-weight:"+fntweight+";overflow-x:hidden;'>"
	textcontent+="<nobr><font color="+messagecolor+">"+message[i_message]+"</font></nobr></span>"
}

function getbgcontent() {
	var bgwidth=scrollerwidth+2*cellpad
	var bgheight=scrollerheight+2*cellpad
	bgcontent="<table style='background-color:"+backgroundcolor+";width:"+bgwidth+"px;height:"+bgheight+"px' cellpadding=0 cellspacing=0 border="+borderwidth+">"
	bgcontent+="<tr><td> "
	bgcontent+="</td></tr></table>"
}

function startnewtime() {
	starttime= new Date()
	starttime=starttime.getTime()
}

function checktime() {
	nowtime=new Date()
	nowtime=nowtime.getTime()
    nowtime=(nowtime-starttime)/1000
	if (nowtime>stoptime) {timetohidescroller=true}
}

function hidescroller() {
	document.getElementById("bgscroller").style.visibility="hidden"
	document.getElementById("text").style.visibility="hidden"
}

function handlerMM(e){
	x = (ns6) ? e.pageX : document.body.scrollLeft+event.clientX
	y = (ns6) ? e.pageY : document.body.scrollTop+event.clientY
	x=x+10
	y=y+10
}

document.onmousemove = handlerMM;
window.onresize=init;
window.onload=init;
</SCRIPT>
<DIV ID="bgscroller" style="position:absolute;left:-5000px;"></DIV>
<DIV ID="text" style="position:absolute;left:-5000px;"></DIV>

IMPORTANT: Do not paste the code into tables or <DIV> and </DIV> tags or between any other container tags!

Step 2: Open your webpage and configure text, style, scrollersize, speed on the top of the script