마우스의 포이트를 기준으로 궤선이 따라 다니는 스크립트입니다.익스플로워 4.0 이상만 지원한다는군요
| Script Example |
<html>
<head><title>Demo34</title>
<style>
#leftright, #topdown{
position:absolute;
left:0;
top:0;
width:2px;
height:2px;
layer-background-color:#00ff00;
background-color:#00ff00;
z-index:100;
font-size:2px;
}
</style>
</head>
<BODY bgcolor="#000000" text="#ffffff" leftmargin="0"
marginwidth="0">
<center>마우스를
따라 다니는 궤선</center>
<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">
<!--
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)
window.onload=regenerate2
//-->
</script>
</body>
</html> |
|
|
| 설명 |
| 파란색 부분 : 스트일 지정에서 궤선의 색을 바꾸시면 됩니다. |
|
|
|
|
