yubb.de-Logo
Tutorials
yubb@yubb
yubbService
Inside yubb

Fadenkreuz



Hiermit kann man ein Fadenkreuz erstellen, welches dem Mauszeiger folgt. (Demo)

Füge diesen Code in den
Code:
<head>...</head>
-Bereich der Seite ein, wo das Fadenkreuz erscheinen soll:

Code:
<style>
<!--
#leftright, #topdown{
position:absolute;
left:0;
top:0;
width:1px;
height:1px;
layer-background-color:blue;
background-color:blue;
z-index:100;
font-size:1px;
}
-->
</style>


und direkt nach dem
Code:
<body>
-Befehl füge noch dieses ein:
Code:
<div id="leftright" style="width:expression(document.body.clientWidth-2)"></div>
<div id="topdown" style="height:expression(document.body.clientHeight-2)"></div>
<script language="JavaScript1.2">
<!--
/*jason theis,http://members.tripod.com/b-lueflame
*/
if (document.all&&!window.print){
leftright.style.width=document.body.clientWidth-2
topdown.style.height=document.body.clientHeight-2
}
else if (document.layers){
document.leftright.clip.width=window.innerWidth
document.leftright.clip.height=1
document.topdown.clip.width=1
document.topdown.clip.height=window.innerHeight
}
function followmouse1(){
//move cross engine for IE 4+
leftright.style.pixelTop=document.body.scrollTop+event.clientY+1
topdown.style.pixelTop=document.body.scrollTop
if (event.clientX<document.body.clientWidth-2)
topdown.style.pixelLeft=document.body.scrollLeft+event.clientX+1
else
topdown.style.pixelLeft=document.body.clientWidth-2
}
function followmouse2(e){
//move cross engine for NS 4+
document.leftright.top=e.y+1
document.topdown.top=pageYOffset
document.topdown.left=e.x+1
}
if (document.all)
document.onmousemove=followmouse1
else if (document.layers){
window.captureEvents(Event.MOUSEMOVE)
window.onmousemove=followmouse2
}
function regenerate(){
window.location.reload()
}
function regenerate2(){
setTimeout("window.onresize=regenerate",400)
}
if ((document.all&&!window.print)||document.layers)
//if the user is using IE 4 or NS 4, both NOT IE 5+
window.onload=regenerate2
//-->
</script>


In dem Teil, der in den
Code:
<head>...</head>
-Bereich kommt, kannst du unter
Code:
layer-background-color
und
Code:
background-color
die Farbe des Fadenkreuzes ändern. Hierzu kannst du hexadezimale Werte benutzen oder die im Internet gebräuchlichen Farbangaben.

Geschrieben von Phil Marx am 18.06.2004 (11738x gelesen)
weiterempfehlen weiterempfehlen   Druckversion Druckversion   kommentieren kommentieren

Naja es ist ja nicht wirklich ein Fadenkreuz sondern nur oben und an der Seite links, aber ansonsten i.O.



hope i helped



:)
Geschrieben von [DS]-=Pencil=-