How to get the mouse in the relative position in the div, in fact, is very simple, there is a good example, interested friends can refer to the following
Code as follows: <HEAD> <TITLE> js get div relative coordinates </TITLE> <script type= "Text/javascript" > <!-- function GetX (obj) { var parobj=obj; var left=obj.offsetleft; while (parobj= parobj.offsetparent) { left+=parobj.offsetleft; } return left; } function GetY (obj ) { var parobj=obj; var top=obj.offsettop; while (parobj = parobj.offsetparent) { top+= parobj.offsettop; } return top; } function Displaycoord (event) { var top,left,odiv; Odiv=document.getelementbyid ("demo"); top=gety (odiv); left=getx (odiv); document.getElementById ("mp_x"). InnerHTML = (event.clientx-left+document.documentelement.scrollleft) -2+ "px"; document.getElementById ("mp_y"). InnerHTML = (event.clienty-top+document.documentelement.scrolltop) -2+ "px"; } //--></script> </HEAD> <body style= "margin:40px" Margin:40px; " > <div style= "background-color: #000000; color: #0011FF; width:300px;height:300px;position:absolute;top : 80px;left:90px;margin:0px; border:0px "Id=" demo "onmousemove=" Displaycoord (event) > I am div, tested, 2PX error ... </div> The current mouse coordinates are: x:<span id= "mp_x" ></span> y:<span id= "mp_y" ></span> </body > </BODY> </HTML> If not, you can try the document.documentelement.scrollleft Replacement document.body.scrollleft Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
