Full version: jsB@nk » Image » Cross Hairs
URL: https://www.javascriptbank.com/crosshairs-index.html
When user click anywhere in the web page, image will display all total.
Full version: jsB@nk » Image » Cross Hairs
URL: https://www.javascriptbank.com/crosshairs-index.html
<STYLE type=text/css>#pic1 {Z-INDEX: 5; VISIBILITY: hidden; POSITION: absolute}#pic2 {Z-INDEX: 5; VISIBILITY: hidden; POSITION: absolute}#pic3 {Z-INDEX: 1; LEFT: 120px; VISIBILITY: hidden; POSITION: absolute; TOP: 100px}BODY {CURSOR: crosshair}</STYLE><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><H2>Click anywhere to see picture</H2><IMG id=pic3 height=480 alt="" src="../logojs.gif" width=640 border=0> <DIV align=center><STRONG>Timber Framed Buildings Warwick England</STRONG></DIV><IMG id=pic2 height=3 alt="" src="crosshairx.gif" width=1 border=0> <IMG id=pic1 height=1 alt="" src="crosshairy.gif" width=3 border=0><SCRIPT>var oh,sw,sh,eh,xpos,ypos,e,d,p;function showElemUnderneath(){sw=window.screen.width;sh=window.screen.height;eh=document.getElementById("pic3").height;ew=document.getElementById("pic3").width;var xpos=(event.clientX)var ypos=(event.clientY) e=document.getElementById("pic1")d=document.getElementById("pic2")e.style.width=ew;//sets the width of the crosshaire.style.left=sw/8.5; //positions the cursor on the crosshair (X pos)e.style.top= ypos-1.5; //positions the cursor on the crosshair (Y pos)if((ypos<=100)||(ypos>=(100+eh))){ //controls visibility of hairs outside picture x axisx=document.getElementById("pic1")x.style.visibility="hidden";}else{x=document.getElementById("pic1")x.style.visibility="visible";}d.style.height=eh; //sets the height of the crosshaird.style.left=xpos-1.5;//positions the cursor on the crosshair (X pos)d.style.top= eh/4.8; //positions the cursor on the crosshair (Y pos)if((xpos<=120)||(xpos>=(120+ew))){ //controls visibility of hairs outside picture y axisx=document.getElementById("pic2")x.style.visibility="hidden";}else{x=document.getElementById("pic2")x.style.visibility="visible";}}document.onmousemove=showElemUnderneath</SCRIPT><SCRIPT>function showpic(){d=document.getElementById("pic3")d.style.visibility="visible";}document.onmousedown=showpic;</SCRIPT><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->http://javascriptbank.com/javascript/image/CrossHairs/crosshairx.gifhttp://javascriptbank.com/javascript/image/CrossHairs/crosshairy.gif