chrome中不一致的hoverIntent行为,在FF和其他页面元素上工作正常

时间:2011-02-15 09:56:40

标签: jquery wordpress firefox google-chrome hoverintent

我正在处理两个页面元素上的简单hoverIntent位(悬停在“search_over”上使“搜索”可见,并且悬停在“subscribe_over”上使“subscribe”可见),我无法弄清楚为什么它是处理“subscribe_over”而不是“search_over”。我现在正在使用Chrome和FF进行测试,它在FF中的两个div上都能正常工作,并且只能在chrome中使用“subscribe_over”。你能帮我搞清楚为什么吗?也许也是相关的:我作为一个独立的页面正在研究这个问题,而我现在正处于wordpress的过程中。它可能是与wp_head中的功能发生冲突的产物,尽管我对那里发生的事情知之甚少不足以做出有根据的猜测。

这是jquery代码:

var mouseOver = false; 
var mouseOver_search = false;

    $('#subscribe').hide();
    $('#subscribe').hover(
        function(){ mouseOver = true; },
        function(){ 
            mouseOver = false;
            $(this).fadeOut(300); 
        }
    );  
    $("#subscribe_over").hoverIntent({
        over: appear, // Function to call when mouseover is called    
        timeout: 500, // How often in milliseconds the onmouseout should be checked
        out: disappear // Function to call when mouseout is called    
    });

    function appear() {
        $('#search').hide();
        $("#subscribe").fadeIn(50);
    }

    function disappear() {
        if (mouseOver == false) $("#subscribe").fadeOut(300);
    }

    $('#search').hide();
    $('#search').hover(
        function(){ mouseOver_search = true; },
        function(){ 
            mouseOver_search = false;
            $(this).fadeOut(300); 
        }
    );  
    $("#search_over").hoverIntent({
        over: appear_s, // Function to call when mouseover is called    
        timeout: 500, // How often in milliseconds the onmouseout should be checked
        out: disappear_s // Function to call when mouseout is called    
    });

    function appear_s() {
        $('#subscribe').hide();
        $("#search").fadeIn(50);
    }

    function disappear_s() {
        if (mouseOver_search == false) $("#search").fadeOut(300);
    }

所以,它实际上是为具有单独函数名称的两个单独元素复制和粘贴的相同代码。它的长度是它需要的两倍,但很明显这两个元素的控制方式相同。如果它有帮助,那就是http://yummrs.com/blog非常仍在建设中!)。

上次我在这里回答了一个问题,我有一个简短的死亡逗号,这是一个简单的修复,但我没有看到任何挥之不去的逗号...提前感谢你的帮助。

2 个答案:

答案 0 :(得分:1)

看起来已经是chrome的已知错误:http://plugins.jquery.com/content/google-chrome-bug-hoverintent

答案 1 :(得分:0)

在您的代码中,您已定义:

<li id="subscribe_over"><a href="#">subscribe &darr;</a></li> 
<li id="search_over"><a>search</a></li> 

您是否错过了搜索href代码的<a>