0

「クリック可能なdiv」とメニューである「nav_menu」を含む2つのdivがあります。"#clickable_div" 用に実装された mouseleave 関数があります。私の問題は、現在発生しているメニューにカーソルを合わせると、slideUp を実行できないことです。これを修正するにはどうすればよいですか?

注:ドロップダウン用の小さなプラグインを使用しています

JSFiddle - > http://jsfiddle.net/HtNK3/13/

コード

$(document).ready(function() {
    var visible = false;

    $('#clickable_div').click(function() {
      visible = true;
      $('#nav_menu').showMenu({
            parent:'#clickable_div'
      });                
    }).mouseleave(function() {

    if(visible) {
        visible = false;
        window.setTimeout(function(){$('#nav_menu').hide('blind');}, 1000);
    }
    });       //end mouseleave     

    $('#l1').click(function() {
    alert("...");               
    });  
});
4

2 に答える 2

2

私の問題は、メニューにカーソルを合わせると、現在発生しているslideUpしないことです。これを修正するにはどうすればよいですか?

次に、マウスリーブでボックスを非表示にしないでください。これをすべて削除します。

.mouseleave(function() {

    if(visible) {
        visible = false;
        window.setTimeout(function(){$('#nav_menu').hide('blind');}, 1000);
    }
 })

編集:

私が考えることができる最も簡単な方法は、全体を別のブロック要素内にラップし、mouseleaveイベントをそれにバインドすることです。解決策を示すために Fiddle を更新しました。

http://jsfiddle.net/HtNK3/20/

于 2012-04-06T07:42:24.023 に答える
0

次のコードが問題を引き起こしています。

     .mouseleave(function() {
        if(visible) {
            visible = false;
            window.setTimeout(function(){$('#nav_menu').hide('blind');}, 1000);
        }); 

あなたがやろうとしているのは、メニューを非表示にするように求めているメニューヘッダーからマウスが離れたときです。

メニュー ヘッダーとメニューの両方でマウス アウトを検出してみてください。その方法については、この回答を確認してください

JS コード

これを行うために利用可能なプラグインはすでにたくさんあり、それらのいずれかを使用して、サイトに合わせて css を変更します

于 2012-04-06T07:45:24.773 に答える