0

私は自分のコードを何度も再確認し、それが機能している別の Web サイトで同様のものを使用しています。サイトへのリンクは次のとおりです。 http://bit.ly/34XhDb

    //add hover intent to dropdown
jQuery(document).ready(function(){
var config = {
sensitivity: 3, // number = sensitivity threshold (must be 1 or higher)
interval: 100, // number = milliseconds for onMouseOver polling interval
over: doOpen, // function = onMouseOver callback (REQUIRED)
timeout: 1200, // number = milliseconds delay before onMouseOut
out: doClose // function = onMouseOut callback (REQUIRED)
};

function doOpen() {
    jQuery(this).addClass("hover");
    jQuery('ul:first',this).fadeIn();
}
function doClose() {
    jQuery(this).removeClass("hover");
    jQuery('ul:first',this).fadeOut();
}
jQuery("ul#main_catnav li").hoverIntent(config);

});

デバッグで確認しましたが、競合しているようには見えず、ホバーのクラスが適用されています。

ありがとうございました！

4

1 に答える 1

1

問題はプラグインではなく、あなたの CSS です。あなたはこれを持っています:

ul#main_catnav ul { /*...other styles... */ display: none; }
ul#main_catnav li:hover ul { display: block}

そのため、マウスが離れると、:hover適用されなくなり、JavaScript ではなく CSS によって即座に非表示になります。li.hover機能させるには、次のように追加する必要があります。

ul#main_catnav ul { /*...other styles... */ display: none; }
ul#main_catnav li:hover ul, ul#main_catnav li.hover ul { display: block}

これは、要素がマウスでホバーされているか、プラグイン.hoverで与えているようなクラスを持っていることを説明しています。hoverIntent

于 2010-11-18T14:50:21.790 に答える