<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style type="text/css">
*{ margin:0; padding:0;}
#box_main{
position:relative;
width:200px;
height:600px;
background:#000000;
left:-200px;}
#list{ position:relative; left:200px;top:250px; background:#000000; color:#FFFFFF; width:50px;}
</style>
<script>
window.onload=function() {
var oDiv = document.getElementById('box_main');
oDiv.onmouseover = function(){
startMove(0);
};
oDiv.onmouseover = function(){
startMove(-200);
}
};
var timer=null;
function startMove(Target){
var oDiv=document.getElementById('box_main');
timer=setInterval(function(){
var speed=0;
if(oDiv.offsetLeft<Target){
speed=-10;
}else{
speed=10;
}
if(oDiv.offsetLeft==Target){
clearInterval(timer);
}else {
oDiv.style.left = oDiv.offsetLeft + speed + 'px';
}
},30)
}
</script>
</head>
<body>
<div id="box_main">
<span id="list">分享</span>
</div>
</body>
</html>
补充楼上 在27行function startMove(Target){ 后加上 clearInterval(timer);
22行onmouseout
31行oDiv.offsetLeft>Target