Kurzbeschreibung Ein frei bestimmbarer Text folgt dem Mauszeiger.
Vorteile Fällt auf. Kurze Ladezeit. Wenig Speicherbedarf. Keine externen Dateien (wie z.B. Bilder) notwendig.
Nachteile Funktioniert nur, wenn der Browser JavaScript ausführen kann.
Schwierigkeit Wer schon erfolgreich HTML-Seiten geschrieben hat bekommt auch das hin.

Text folgt Maus

Ein beliebiger Text folgt dem Mauszeiger. Ist eine Mischung aus Java-Script und DHTML.

Der Source Code:

Kopiere folgendes in den Head Deiner Seite (also zwischen <head> und </head>) :

<style>
.spanstyle {
position:absolute;
visibility:visible;
top:-50px;
font-size:12pt;
font-family:Arial;
font-weight:bold;
color:black;
}
</style>
<script>

var x,y
var step=20
var flag=0

// Deine Nachricht! Wichtig! Am Ende des Satzes ein Leerzeichen einfügen!
var message="Hallo. Wie gefällt dir diese Anleitung? "
message=message.split("")

var xpos=new Array()
for (i=0;i<=message.length-1;i++) {
xpos[i]=-50
}

var ypos=new Array()
for (i=0;i<=message.length-1;i++) {
ypos[i]=-50
}

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

function makesnake() {
if (flag==1 && document.all) {
for (i=message.length-1; i>=1; i--) {
xpos[i]=xpos[i-1]+step
ypos[i]=ypos[i-1]
}
xpos[0]=x+step
ypos[0]=y

for (i=0; i<message.length-1; i++) {
var thisspan = eval("span"+(i)+".style")
thisspan.posLeft=xpos[i]
thisspan.posTop=ypos[i]
}
}

else if (flag==1 && document.layers) {
for (i=message.length-1; i>=1; i--) {
xpos[i]=xpos[i-1]+step
ypos[i]=ypos[i-1]
}
xpos[0]=x+step
ypos[0]=y

for (i=0; i<message.length-1; i++) {
var thisspan = eval("document.span"+i)
thisspan.left=xpos[i]
thisspan.top=ypos[i]
}
}
var timer=setTimeout("makesnake()",30)
}

</script>

Kopiere folgendes in den Body Deiner Seite (also zwischen <body> und </body>) :

<script>
<!-- Beginning of JavaScript -

for (i=0;i<=message.length-1;i++) {
document.write("<span id='span"+i+"' class='spanstyle'>")
document.write(message[i])
document.write("</span>")
}

if (document.layers){
document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = handlerMM;

// - End of JavaScript - -->
</script>

Und schließlich ins Body-Tagdeiner Seite (also zwischen <body und dem nächsten >) :

onLoad="makesnake()" style="width:100%;overflow-x:hidden;overflow-y:scroll"

Um einen Link zu setzen, der direkt auf diese Seite führt, verwende folgende Url: