Event screenY, screenX : Event Properties « Event « JavaScript DHTML






  1. JavaScript DHTML
  2. Event
  3. Event Properties

Event screenY, screenX

 
    
<html>
<body>
<script language="JavaScript">
function function2() {
    myX.innerHTML = window.event.offsetX;
    myY.innerHTML = window.event.offsetY;
    mySX.innerHTML = window.event.screenX;
    mySY.innerHTML = window.event.screenY;
    mySH.innerHTML = myDiv.scrollHeight;
    mySW.innerHTML = myDiv.scrollWidth; 
}
function function1() {
    mySL.innerHTML = myDiv.scrollLeft;
    myST.innerHTML = myDiv.scrollTop; 
} 
</script>
<p>
   <b>X Coordinate:</b> 
   <span id="myX">0</span>
</p>
<p>
   <b>Y Coordinate:</b> 
   <span id="myY">0</span>
</p>
<p>
   <b>Screen X:</b> 
   <span id="mySX">0</span>
</p>
<p>
   <b>Screen Y:</b> 
   <span id="mySY">0</span>
</p>
<p>
   <b>Scroll Height:</b> 
   <span id="mySH">0</span>
</p>
<p>
   <b>Scroll Width:</b> 
   <span id="mySW">0</span>
</p>
<p>
   <b>Scroll Left:</b> 
   <span id="mySL">0</span>
</p>
<p>
   <b>Scroll Top:</b> 
   <span id="myST">0</span>
</p>
<div id="myDiv" 
     onmousemove="function2();" 
     onscroll="function1();" 
     style="border:solid; width:200; height:50; overflow:scroll;">
   <img src="http://www.java2s.com/style/logo.png">
</div>
</body>
</html>








Related examples in the same category

1.Event qualifier
2.Event saveType
3.Event nextPage
4.Event repeat
5.Event return Value
6.Event pageY and pageX
7.Event offsetY and offsetY
8.Event 'layerY'
9.Event 'layerX'
10.Event 'propertyName'
11.Event from Element
12.Event screenX
13.Event 'target' Example
14.Event 'srcUrn' Example
15.Event source element
16.Event to Element
17.Event type
18.Event y and x Property
19.'contentOverflow' Example
20.'cancelBubble' Example
21.Get event Phase: CAPTURING,BUBBLING