javascriptはマウスの箱の中の座標を取得します.
10255 ワード
1 DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
6 <meta http-equiv="X-UA-Compatible" content="ie=edge">
7 <title>Documenttitle>
8 <style media="screen">
9 .box {
10 width: 300px;
11 height: 200px;
12 padding-top: 100px;
13 margin: 100px;
14 font: 18px/1.5 "simsun";
15 background-color: lemonchiffon;
16 text-align: center;
17 cursor: pointer;
18 }
19 style>
20 head>
21 <body>
22 <div class="box">div>
23
24 <script src="animate.js" charset="utf-8">script>
25 <script type="text/javascript">
26 var div = document.getElementsByTagName("div")[0];
27 div.onmousemove = function(event){
28 event = event || window.event;
29
30 var pagex = event.pageX || scroll().left + event.clientX;
31 var pagey = event.pageY || scroll().top + event.clientY;
32
33 var divx = div.offsetLeft;
34 var divy = div.offsetTop;
35
36 var targetx = pagex - divx;
37 var targety = pagey - divy;
38
39 this.innerHTML = " X :" + targetx + "px;
" + " Y :" + targety + "px;";
40 }
41 script>
42 body>
43 html>
転載先:https://www.cnblogs.com/knuzy/p/8869070.html