54、图片的十字瞄准线

54、图片的十字瞄准线

脚本说明:

把如下代码加入<body>区域中

<STYLE type=text/css>.hair {

       BACKGROUND-COLOR: red; FONT-SIZE: 1px; HEIGHT: 1px; LEFT: 0px; POSITION: absolute; TOP: 0px; WIDTH: 1px; layer-background-color: red

}

</STYLE>

<DIV class=hair id=xhair></DIV>

<DIV class=hair id=yhair></DIV>

<DIV id=target

style="HEIGHT: 32px; LEFT: 12px; POSITION: absolute; TOP: 0px; WIDTH: 722px"><IMG

border=0 height=32 src="boy5c.gif" width=32> </DIV>

<SCRIPT language=javascript>

var isNS=(navigator.appName=="Netscape");

var _all=(isNS)? '' : 'all.' ;

var _style=(isNS)? '' : '.style' ;

var _visible=(isNS)? 'show' : 'visible';

 

var xhair=eval('document.'+_all+'xhair'+_style);

var yhair=eval('document.'+_all+'yhair'+_style);

var target=eval('document.'+_all+'target'+_style);

 

function resize(){

if(isNS){

xhair.clip.width=window.innerWidth;

xhair.clip.height=1;

yhair.clip.width=1;

yhair.clip.height=window.innerHeight;

}else{

xhair.width=document.body.clientWidth;

yhair.height=document.body.clientHeight;

}}

 

function movehair(evnt){

if(isNS){

xhair.moveTo(pageXOffset,evnt.pageY);

yhair.moveTo(evnt.pageX,pageYOffset);

target.moveTo(evnt.pageX-20,evnt.pageY-20);

}else{

xhair.pixelTop=event.clientY+document.body.scrollTop;

xhair.pixelLeft=document.body.scrollLeft;

yhair.pixelLeft=event.clientX+document.body.scrollLeft;

yhair.pixelTop=document.body.scrollTop;

target.pixelTop=event.clientY+document.body.scrollTop-20;

target.pixelLeft=event.clientX+document.body.scrollLeft-20;

}

return false;

}

 

function reloadNS(){

setTimeout('window.location.reload()', 500);

}

 

(isNS)? window.onresize=reloadNS : window.onresize=resize;

 

if(isNS)document.captureEvents(Event.MOUSEMOVE);

document.onmousemove=movehair;

 

window.onload=resize;

 

</SCRIPT>

 

Write a comment

Comments: 0