<style>
*{
margin: 0
padding: 0;
}
#div1{
background: red;
width: 200px;
height: 100px;
left: -200px;
float: left;
position: absolute;
}
#share{
background: blue;
width: 20px;
height: 50px;
position: absolute;
left:200px;
top:25px;
}
</style>
</head>
<body>
<span id="weizhi"></span>
<div id="div1">
<span id="share">分享</span>
</div>
<script>
window.οnlοad=function(){
var oDiv=document.getElementById('div1');
oDiv.οnmοuseοver=function(){
startMove();
}
}
var timer=null;
function startMove(){
var oDiv=document.getElementById('div1');
var weizhi=document.getElementById('weizhi');
var speed=10;
timer=setInterval(function(){
if(oDiv.offsetLeft > -10){
clearInterval(timer);
return;
}
oDiv.style.left=oDiv.offsetLeft+speed+'px';
weizhi.innerHTML=oDiv.offsetLeft;
},30);
}
*{
margin: 0
padding: 0;
}
#div1{
background: red;
width: 200px;
height: 100px;
left: -200px;
float: left;
position: absolute;
}
#share{
background: blue;
width: 20px;
height: 50px;
position: absolute;
left:200px;
top:25px;
}
</style>
</head>
<body>
<span id="weizhi"></span>
<div id="div1">
<span id="share">分享</span>
</div>
<script>
window.οnlοad=function(){
var oDiv=document.getElementById('div1');
oDiv.οnmοuseοver=function(){
startMove();
}
}
var timer=null;
function startMove(){
var oDiv=document.getElementById('div1');
var weizhi=document.getElementById('weizhi');
var speed=10;
timer=setInterval(function(){
if(oDiv.offsetLeft > -10){
clearInterval(timer);
return;
}
oDiv.style.left=oDiv.offsetLeft+speed+'px';
weizhi.innerHTML=oDiv.offsetLeft;
},30);
}