鼠标放在最左边的时候，e.pageX为什么是13？
慕粉2236556370
2017-03-17 14:29
.left div,
.right div {
width: 300px;
height: 80px;
padding: 5px;
margin: 5px;
border: 1px solid #ccc;
}
.left div {
background: #bbffaa;
}
<h4>测试二</h4>
<div class="left">
<div class="aaron1">
<p>鼠标在绿色区域移动触发mousemove</p>
<p>移动的X位置：</p>
</div>
</div>
<script type="text/javascript">
//绑定一个mousemove事件
//触发后修改内容
$(".aaron1").mousemove(function(e) {
$(this).find('p:last').html('移动的X位置：' + e.pageX)
// e.pageX是鼠标相对于文档边缘（文档边缘也就是document的边缘）的X轴位置
})
</script>
4回答
-
- 我爱小小小橘子
- 2017-09-06 10:05:45
你把这段初始样式指令放进去，再将例子里
.left div,
.right div
的css的padding margin 和border全部设置为0，那么e.pageX 初始值就为0
.left div,
.right div {
width: 300px;
height: 80px;
padding: 0px;
margin: 0px;
border: 0px solid #ccc;
}
body{ margin: 0;padding: 0;font-family: "微软雅黑";overflow: hidden;}
body,html{-webkit-text-size-adjust: none;width: 100%;height: 100%;}
*{text-decoration: none;list-style: none;}
img{border: 0px;}
ul,li,dl,dd,dt,p,ol,h1,h2,h3,h4,h5{font-size: 12px;font-weight: 100;padding: 0;margin: 0;}
.wrap{margin: 0 auto;}
.fl{float: left;}
.fr{float: right;}
.index{overflow: hidden;}
.clr{clear:both; height:0px; width:100%; font-size:1px; line-height:0px; visibility:hidden; overflow:hidden;}
.pointer{cursor:pointer;}
a,input,button{ outline:none; }
::-moz-focus-inner{border:0px;}
/*a:link {color:#0f0;text-decoration:none;}
a:visited {color: #FFFF00; text-decoration:none;}
a:hover {color: #00FF00; text-decoration:underline;}
a:active {color: #0000FF; text-decoration:underline;}*/
a{color: #000;}
.wrapper{clear: both;width: 100%;}
word-break:break-all /*文字换行*/
/*white-space:nowrap 文字不换行*//*默认滚动条样式修改ie9 google Firefox 等高版本浏览器有效*/
/*::selection {background: #D03333;color: white;text-shadow: none;}
::-webkit-scrollbar-track-piece{width:10px;background-color:#f2f2f2}
::-webkit-scrollbar{width:10px;height:6px}
::-webkit-scrollbar-thumb{height:50px;background-color:rgba(0,0,0,.3);}
::-webkit-scrollbar-thumb:hover{background:#cc0000}*/
/*渐变*/
/*background-image: -moz-linear-gradient(top, #8fa1ff, #3757fa);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ff4f02), color-stop(1, #8f2c00)); Saf4+, Chrome
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c6ff00', endColorstr='#538300', GradientType='0'); IE*/ -
- 沉鱼yy
- 2017-03-20 11:08:48
不是起始值，是鼠标在相对可视窗口当前位置的值
-
- 沉鱼yy
- 2017-03-20 11:03:52
e.PageX是获取当前光标的横坐标
最左边是鼠标在绿色区域移动触发mousemove的X轴的起始值，至于是怎么计算是我也不知道。以上纯属个人理解
-
- 沉鱼yy
- 2017-03-17 14:49:09
e.pageY 、 e.pageX 是指鼠标的XY（水平、垂直方向）位置值
jQuery基础(三)—事件篇
89997 学习 · 625 问题
相似问题