努力擺脫mouseover不上載

-1

我試圖讓這個div只在mouseover上擺動，而不是在頁面加載上。這裏是JS：努力擺脫mouseover不上載

(function swing() { 
var ang = 20, 
    dAng = 10, 
    ddAng = .5, 
    dir = 1, 
    box = document.getElementById("box"); 

(function setAng(ang){ 
    box.style.WebkitTransform = 'rotate('+ang+'deg)'; 
    box.style.MozTransform = 'rotate('+ang+'deg)'; 
    dir = -dir; 
    if (dAng > 1) 
     dAng -= ddAng; 

    if (Math.abs(ang) > 0) 
     setTimeout(setAng, 1000, dir * (Math.abs(ang)-dAng)); 
})(ang); 

box.mouseover = function(){ 
    box.style.WebkitTransform = 'rotate(-20deg)'; 
    box.style.MozTransform = 'rotate(-20deg)'; 
    setTimeout(swing, 1000); 
} 
})();

正如你所看到的，它是負載擺動。只是不是鼠標懸停。

這裏是的jsfiddle：http://jsfiddle.net/qqsLW/

乾杯傢伙

來源

2014-03-28 MarkP

鼠標懸停更改爲onmouseover –

嘗試*閱讀*有用的標記彈出窗口，然後將它們貼在您的帖子上。 –

試試這個，這對我的作品

(function swing() { 
var ang = 20, 
    dAng = 10, 
    ddAng = .5, 
    dir = 1, 
    box = document.getElementById("box"); 

function setAng(ang){ 
    box.style.WebkitTransform = 'rotate('+ang+'deg)'; 
    box.style.MozTransform = 'rotate('+ang+'deg)'; 
    dir = -dir; 
    if (dAng > 1) 
     dAng -= ddAng; 

    if (Math.abs(ang) > 0) 
     setTimeout(setAng, 1000, dir * (Math.abs(ang)-dAng)); 
}; 

box.onmouseover = function(){ 
    console.log('over'); 
    box.style.WebkitTransform = 'rotate(-20deg)'; 
    box.style.MozTransform = 'rotate(-20deg)'; 
    setTimeout(function(){ 
     setAng(ang) 
    }, 1000); 
}

}）（）;

來源

2014-03-28 15:08:22

@ ukasz-szewczak - 我現在已將它添加到我的網站，並且出現此錯誤：Uncaught TypeError：無法設置null屬性'onmouseover' - 任何想法？ – MarkP

它看起來像你的代碼沒有找到容器與「盒子」ID –

@ ukasz-szewczak它絕對存在。：'（ – MarkP

就拿鼠標懸停分配了swing功能。

如果您還想阻止它立即執行，請不要運行swing，即在定義後刪除()。

來源

2014-03-28 15:04:45 blgt

努力擺脫mouseover不上載

回答

相關問題