Mausverfolger mit Sternen

Moderator: HTML-Laie

Antworten
Benutzeravatar
Hape
Administrator
Beiträge: 336
Registriert: Fr 22. Mai 2020, 00:33

Mausverfolger mit Sternen

Beitrag von Hape »

Code: Alles auswählen

<script type='text/javascript'>
<!--
kissAnzahl = 3 //Anzahl der maximalen Bilder, die auf einmal angezeigt werden
lastKiss = 1 //welches Bild soll zuletzt angezeigt werden? (zwischen 0 und 1 w&auml;hlen)
kissDauer = 1000 //Dauer der Anzeige der Bilder auf dem Bildschirm (in Millisekunden)
kissAbstand = 50 //Abstand des Mauszeigers bevor das n&auml;chste Bild erscheint
erstesBild = "/sterne.gif" //das erste Bild
zweitesBild = "/sterne.gif" //das zweite Bild
//Ab hier nichts mehr &auml;ndern
var docLayers = (document.layers) ? true:false;
var docId = (document.getElementById) ? true:false;
var docAll = (document.all) ? true:false;
var docbitK = (docLayers) ? "document.layers['":(docId) ? "document.getElementById('":(docAll) ? "document.all['":"document."
var docbitendK = (docLayers) ? "']":(docId) ? "')":(docAll) ? "']":""
var stylebitK = (docLayers) ? "":".style"
var showbitK = (docLayers) ? "show":"visible"
var hidebitK = (docLayers) ? "hide":"hidden"
var ns6=document.getElementById&&!document.all

var posX, posY, lastX, lastY, kissAnzahl, lastKiss, kissDauer, kissAbstand, erstesBild
lastX = 0
lastY = 0

function kissMeNow(e) {

posX = getMouseXPos(e)
posY = getMouseYPos(e)
if (posX>(lastX+kissAbstand)||posX<(lastX-kissAbstand)||posY>(lastY+kissAbstand)||posY<(lastY-kissAbstand)) {
showKiss(posX,posY)
lastX = posX
lastY = posY
}
}

function getMouseXPos(e) {
if (document.layers||ns6) {
return parseInt(e.pageX+10)
} else {
return (parseInt(event.clientX+10) + parseInt(document.body.scrollLeft))
}
}

function getMouseYPos(e) {
if (document.layers||ns6) {
return parseInt(e.pageY)
} else {
return (parseInt(event.clientY) + parseInt(document.body.scrollTop))
}
}

function showKiss(x,y) {
var processedx=ns6? Math.min(x,window.innerWidth-75) : docAll? Math.min(x,document.body.clientWidth-55) : x
if (lastKiss >= kissAnzahl) {lastKiss = 0}
eval(docbitK + "kisser" + lastKiss + docbitendK + stylebitK + ".left = " + processedx)
eval(docbitK + "kisser" + lastKiss + docbitendK + stylebitK + ".top = " + y)
eval(docbitK + "kisser" + lastKiss + docbitendK + stylebitK + ".visibility = '" + showbitK + "'")
if (eval("typeof(kissDauer" + lastKiss + ")")=="number") {
eval("clearTimeout(kissDauer" + lastKiss + ")")
}
eval("kissDauer" + lastKiss + " = setTimeout('hideKiss(" + lastKiss + ")',kissDauer)")
lastKiss += 1
}

function hideKiss(knum) {
eval(docbitK + "kisser" + knum + docbitendK + stylebitK + ".visibility = '" + hidebitK + "'")
}

function kissbegin(){
if (docLayers) {
document.captureEvents(Event.MOUSEMOVE)
document.onMouseMove = kissMeNow;
} else {
document.onmousemove = kissMeNow;
}
}

if (document.all||document.getElementById||document.layers){
for (k=0;k<kissAnzahl;k=k+2) {
document.write('<div id="kisser' + k + '" style="position:absolute;top:0px;left:0px;visibility:hidden;"><img src="' + erstesBild + '" alt="" border="0"></div>\n')
document.write('<div id="kisser' + (k+1) + '" style="position:absolute;top:0px;left:0px;visibility:hidden;"><img src="' + zweitesBild + '" alt="" border="0"></div>\n')
}
}
window.onload=kissbegin;

//-->
</script>
Demoseite hierzu: https://hapes-javascript-demo-page.hpag ... terne.html
Dateianhänge
sterne.gif
sterne.gif (1.65 KiB) 5212 mal betrachtet
stern2.gif
stern2.gif (215 Bytes) 5212 mal betrachtet
stern.gif
stern.gif (215 Bytes) 5212 mal betrachtet

Antworten