的Javascript動畫使用transform.js

我與使用但是我使用的是相同的元素多次轉變這裏http://www.binpress.com/app/demo/app/145 的Javascript動畫使用transform.js

demo'd插件轉移執行一些動畫。

基本上我有一個圍繞中心點的5個圓圈作爲衛星物體的動畫。中心點有一個小箭頭，當你將鼠標懸停在任何衛星點上時，它將使用這個插件轉換爲懸停的衛星圓。

下面是我在做什麼，簡化了一個例子。

jQuery(".applications").bind('mouseover', function(){ 
    console.log('fired the second animation'); 
    jQuery(".midpointer").animate({ 
     transform: 'rotate(190deg)' 
    }); 
}); 


jQuery(".hosting").bind('mouseover', function(){ 
    console.log('fired the second animation'); 
    jQuery(".midpointer").animate({ 
     transform: 'rotate(190deg)' 
    }); 
});

現在的問題是，在第一次動畫之後，任何後續的盤旋都不會旋轉元素。所以我假設我需要做一些形式的重置，我一直在看jQuery中的.stop（），但沒有多大用處。

有人對我說過這些嗎？

來源

2011-12-15 David

我相信你每次做鼠標時都會從起始位置旋轉190度，而不是相對於當前對象的旋轉。根據文檔，你可以使用+=添加到當前的旋轉： transform: '+=rotate(190deg)'

來源

2011-12-15 12:08:07

感謝您的建議，但是，第一樂章後，該對象將沒有移動的某些原因。在另一個動畫可以執行之前，必須完成一些操作才能清除對象。 – David 2011-12-15 14:04:55

的Javascript動畫使用transform.js

回答

相關問題