為什么我用margin-left來做速度動畫,出不來效果
? ?var timer=null;
window.onload=function ?() {
var obigbox=document.getElementById('bigbox');
var osmallbox=document.getElementById('smallbox');
osmallbox.onmouseover=function(){
startMove();
}
}
function startMove () {
var obigbox=document.getElementById('bigbox');
? ? ? ? clearInterval(timer);
? ?timer=setInterval(function () {
? ? console.log("hello");
? ? if (obigbox.offsetLeft==0) {
? ? ?clearInterval(timer);
? ? ? ? ?}
? ? ? ? else{
? ? obigbox.style.cssText='margin-left:'+obigbox.offsetLeft+10+'px;'
? ?
? ? }
? ? console.log(obigbox.offsetLeft+' ');
? ?},30)
? ??
? ??
}
2016-03-23
?1.obigbox.style.cssText='margin-left:'+obigbox.offsetLeft+10+'px;'使用這個方法控制css會將此元素原來的所有css樣式全部覆蓋掉(如果是將css寫在行間的話可能運動了你看不出來)。
2.運動的時候太快你看不出來(因為'margin-left:'+obigbox.offsetLeft+10+'px;'此處的obigbox.offsetLeft+10會拼接成一個字符串然后就不會達到你想要的效果了如8+10='810'而不是18).
3.我猜的