| <html> |
| <head> |
| <style type="text/css"> |
| div.solidborder |
| { |
| border-style:solid; |
| border-width:1px; |
| } |
| </style> |
| |
| <script type="text/javascript" src="js/jquery-3.5.1.min.js"></script> |
| <script type="text/javascript" src="js/jquery-ui-1.12.1.min.js"></script> |
| <script type="text/javascript"> |
| jQuery(document).ready(function(){ |
| $('#mousetracker').mousemove(function(e){ |
| xPos = e.pageX - this.offsetLeft; |
| yPos = e.pageY - this.offsetTop; |
| $('#status').html(xPos + ', ' + yPos); |
| }); |
| }) |
| |
| </script> |
| <body> |
| <b>Div tracking mouse position.</b> |
| <br> |
| <div id="mousetracker" class="solidborder" style="position: absolute; left: 10px; top: 80px; height: 400px; width: 100px; padding: 0px;"> |
| Move mouse here. |
| </div> |
| <h2 id="status"> |
| 0, 0 |
| </h2> |
| </body> |
| </html> |
