2012-08-02 58 views
2

請參閱http://jsfiddle.net/cgWdF/3/替代.is(「:hover」)?在Opera中不起作用

在每個瀏覽器*中都能正常工作,除了最新的歌劇。

*下面IE9

沒有測試應該已經指定,它需要返回true或false,我不使用它來綁定一個事件。

+0

jQuery的['.hover'(HTTP:// API .jquery.com/hover /)處理程序不適合你? – 2012-08-02 04:42:48

+0

不幸的是,沒有。我不能在if語句中使用.hover,這是我需要的。 – user1429671 2012-08-02 04:46:59

+0

那麼,無論你需要它做什麼,你都可以在該處理程序中使用'.data()'並檢查這些數據。 – 2012-08-02 04:47:48

回答

5

jQuery的.hover作品在Opera 12

var $sample = $("#sample"); 
$sample.hover(function() { 
    $sample.css("background", "yellow"); 
}, function() { 
    $sample.css("background", ""); 
}); 

Fiddle

或者,使用.data存儲懸停狀態和測試反對(類似於原來的提琴):

var $sample = $("#sample"); 
$sample.hover(function() { 
    $(this).data('hovering', true); 
}, function() { 
    $(this).data('hovering', false); 
}); 

setInterval(function(){ 
    var $sample = $("#sample"); 
    if($sample.data('hovering')) { 
     $sample.css("background", "yellow"); 
    } 
    else { 
     $sample.css("background", ""); 
    } 
}, 200); 

Fiddle

+0

謝謝,這就是我所需要的。 – user1429671 2012-08-02 05:05:05

+0

http://jsfiddle.net/cgWdF/9/ – user1429671 2012-08-02 05:15:24

+0

很好地完成了,在附加一個新的懸停處理程序以將多個懸停事件堆棧到同一元素之前,我會調用'.off('hover')':[小提琴](http://jsfiddle.net/cgWdF/10/),但性能明智,這應該無關緊要,直到你沒有重新加載頁面一百萬次徘徊。 '=]' – 2012-08-02 05:20:14

0

您可以使用.mouseover()和.mouseout()來實現相同的效果。如果你想在動畫的延遲,你可以在jQuery UI的

$('#sample').mouseover(
     function() { 
      $(this).stop().animate({ 
       backgroundColor: "yellow"}, 200); 
     }); 

$('#sample').mouseout(
     function() { 
      $(this).stop().animate({ 
       backgroundColor: "#aaa"}, 200); 
     }); 

http://jsfiddle.net/cgWdF/8/

0

在jQuery 1.9.1使用.animate(),其他瀏覽器已經趕上歌劇 - 它現在不再有效。 「it」就是.is(「:hover」),正如你的小提琴所調查的那樣。

我寫的。是個解決方法( 「:懸停」),看到小提琴http://jsfiddle.net/mathheadinclouds/BxL4w/

function mouseIsOver(what){ 
    return $(what).is(":hover"); 
} 
function mouseIsOverWorkaround(what){ 
    var temp = $(what).parent().find(":hover"); 
    return temp.length == 1 && temp[0] == what; 
} 
function mo(what){ 
    return document.getElementById("workaround").checked ? mouseIsOverWorkaround(what) : mouseIsOver(what); 
} 
setInterval(function(){ 
    var theBox = $("#theBox"); 
    if(mo(theBox[0])) { 
     theBox.css("background", "yellow"); 
    } else { 
     theBox.css("background", ""); 
    } 
}, 200); 

和HTML

<input type="checkbox" id="workaround"/> 
<div id="theBox"></div>