« »

A small phrase will wave as if like a flag to the side of your cursor mouse. Customizable.

Label: waving, mouse pointer, trailer, Waving Mouse Trail, cursor mouse, pointers mouse

Demo
Enlarge
Reload
New window

Code
JavaScript
HTML
Print

Copy All x2

<SCRIPT language=javascript>

//Five Main Variables:

var phrase = "JavaScriptBank.com"; //The phrase that is to wave behind the mouse.
var bouncespeed = 10;      //With what intensity it waves.
var speed = 1;             //How fast it waves (on a millisecond scale).
var Xoffset = 15;          //Distance from mouse along X axis.
var Yoffset = 15;          //Distance from mouse along Y axis.
var color = "black";       //Color of text.


//Variables that don't need to be changed:

var letters = new Array();
letters = phrase.split('');
var object;
var theta = 0;
var MouseX = 0;
var MouseY = 0;

//The rest of the code, change at your own risk:

document.onmousemove=mouse;

function mouse(e) {
MouseX = event.x + Xoffset;
MouseY = event.y + Yoffset;
window.status = "(" + MouseX + ", " + MouseY + ")";
}

function createobjects() {
for (i=0; i < letters.length; i++) {
document.write('<div id="letterwave" style="position:absolute;"><font color='+color+'>'+letters[i]+'</font></div>');
}
object = document.all('letterwave');
objectmove();
}

function objectmove() {
theta += 4;
for (i=0; i<letters.length; i++) {
object[i].style.top = MouseY;
var leftnum = MouseX + i * 10 + (Math.sin(theta * Math.PI / 180 + (2 * Math.PI / object.length * i))) * bouncespeed;
if (leftnum < 0) {
leftnum *= -1;
}
object[i].style.left = leftnum;
}
if (theta > 360) {
theta = 0;
}
setTimeout("objectmove();", speed);
}

</SCRIPT>

Copy All x2