首頁猿問求大神幫我看看為什么移出移入速度為...

求大神幫我看看為什么移出移入速度為什么不同，并且還停不下來

JavaScript

qq_吃藥先森_03169839 2016-05-06 15:44:14

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><style type="text/css">all{ margin:0; padding:0;}div{ background-color:red; width:200px; height:300px; left:-200px; position:relative;}span{ background-color:blue;width:20px; height:40px; position:absolute;left:200px; color:#FFF; top:75px;}</style><script>window.onload=function(){?? ?var timer=null,?? ??? ?a=document.getElementById('a');?? ??? ?a.onmouseover=function(){?? ??? ?Move(10,0);?? ?}?? ?a.onmouseout=function(){?? ??? ?Move(-10,-200);?? ??? ?}?? ?function Move(speed,num){?? ??? ?clearInterval(timer);?? ??? ?a=document.getElementById('a');?? ??? ?timer=setInterval(function(){?? ??? ??? ?if(a.offsetLeft == num)?? ??? ??? ?{?? ??? ??? ??? ?clearInterval(timer);?? ??? ??? ??? ??? ??? ?}?? ??? ??? ?else{?? ??? ??? ??? ?a.style.left=a.offsetLeft+ speed +'px';?? ??? ??? ??? ?}?? ??? ??? ?},30);?? ??? ?}?? ?}</script><title>無標題文檔</title></head><div id="a"><span id="box">分享</span></div><body></body></html>

查看完整描述

2 回答

已采納

qq_青棗工作室_0

TA貢獻446條經(jīng)驗獲得超754個贊

div{?background-color:red;?width:200px;?height:300px;?left:-200px;?position:relative;}

這里的?position:relative 要改為?position:absolute;

2 反對回復 2016-05-06

qq_吃藥先森_03169839
實現(xiàn)了！謝謝你，可以跟我講一下具體的原理么。

回復 2016-05-06
qq_青棗工作室_0
因為你的 all{ margin:0; padding:0;} 寫錯了，導致在position:relative時，a.offsetLeft跟a.style.left的值不同。改為 *{margin:0; padding:0}，可保留原來的 position:relative

回復 2016-05-06