1
我開始玩SVG圖像,我製作了兩個應該打開.mouseenter()並停在.mouseleave()上的大齒輪。轉向由setInterval函數完成。 我有一個奇怪的問題,因爲在Linux Chromium上一切正常。在Linux Firefox和Windows上Chrome和Firefox大齒輪不會停留在mouseLeave上,並會加速mouseEnter。我正在嘗試.hover()和.mouseenter()/ mouseLeave()方法。jQuery mouseleave和clearInterval不起作用
我的代碼:
$(document).ready(function(){
var deg = 0;
var rotate_right = $('#cog1 use');
var rotate_left = $('#cog2 use');
var interval;
$("#cogs").hover(
function(){
interval = setInterval(function(){
if(deg >= 360) deg = 0;
deg += 1;
rotate_right.attr('transform', 'rotate('+deg+',32,32)');
rotate_left.attr('transform', 'rotate('+-deg+',32,32)');
}, 10);
},
function(){
clearInterval(interval);
}
);
});
這取決於你如何將鼠標懸停在上面。看起來你的容器中有一個洞,所以如果你從左到右移動到中心位置,它將設置一個新的間隔,然後有機會清除舊的。我在鼠標輸入部分添加了一個明確的時間間隔(清空後檢查null並將其設置爲null)並觀察發生了什麼:http://jsfiddle.net/UM88Y/2/ – gpgekko