测试时移入鼠标box1的style left在0和-10之间跳动，移出时在-190和-200这两个值跳动
<!doctype html>
<html>
<head>
<title>测试offset</title>
<meta charset="utf-8">
<style>
*{margin:0px; padding:0px;}
#box1{width:200px; height:200px; background-color:green; position:relative;left:-200px; top:0px;}
#box1 span{background-color:blue;position:absolute; left:200px; top:75px;}
</style>
</head>
<body>
<div id="box1"><span>分享</span></div>
<script>
window.onload=function(){
var mydiv=document.getElementById("box1");
mydiv.onmouseover=function(){
startMove(10,0);}
mydiv.onmouseout=function(){
startMove(-10,-200);}
}
function startMove(speed,mytarget){
clearInterval(i);
var mydiv=document.getElementById("box1");
var i=null;
i=setInterval(function(){
if(mydiv.offsetLeft==mytarget)
{
clearInterval(i);}
else{
mydiv.style.left=mydiv.offsetLeft+speed+"px";
}
},30)
}
</script>
</body>
</html>
