<html>
<meta charset="utf-8">
<title>内嵌滑鼠</title>
<script type="text/javascript">
window.onload = function(){
var oDiv = document.getElementById("div1");
var oParent = document.getElementById("parent");
var disX = 0;
oDiv.onmousedown=function (ev)
{
var oEvent = ev||event;
disX=oEvent.clientX-oDiv.offsetLeft;
document.onmousemove=function(ev)
{
var oEvent=ev||event;
var l=oEvent.clientX-disX;
if (l<0) {
l=0;
}
else if (l>oParent.offsetWidth-oDiv.offsetWidth) {
l=oParent.offsetWidth-oDiv.offsetWidth;
}
oDiv.style.left=1+'px';
document.title=1/580;
};
document.onmouseup=function(){
document.onmousemove=null;
document.onmouseup=null;
}
return false;
};
};
</script>
<style>
#div1 {
position: absolute;
width: 20px;
height: 20px;
background-color: black;
left: 0;
top: 0;
z-index: 1;
}
#parent{
position: relative;
width: 600px;
height: 20px;
background-color: red;
margin:10px auto;
}
</style>
<body>
<div id="parent">
<div id="div1">
</div>
</div>
</body>
</html>
是在浏览器里面的一个scroll
oDiv.style.left=1+'px';
写成了数字1,应该是字符l
数字变量搞不清楚。。变量名自己都搞不清楚,1和l在键盘上离开那么远。
1.闭包太多
2.做拖动用鼠标位移增量去修改效果最好。
div.style.left = parseInt(div.style.left) + newMouseX - oldMouseX + 'px';