javascript - カーソルがdiv内にある場合は、ブロックjqueryを表示します

Question

ここに問題の jsfiddle があります: http://jsfiddle.net/MEJgb/

フッターの任意の場所にカーソルを合わせると、トグルダウンがアクティブになり、フッターからマウスを移動するまでアクティブのままになります。

score 1 · Accepted Answer

あなたの問題は次の行です：

    jQuery('html,body').animate({
        scrollTop: jQuery("#footer_copy_right").offset().top
    }, 'slow');

これにより、ページ全体が移動し、ホバーしていたアイテムがホバーされなくなり、イベントが再びトリガーされ、テキストが非表示になります。私がテストしていたとき、これによりホバーコンテンツがマウスの下に戻り、再びトリガーされました...

個人的には、この状況ではホバーを使用せず、ユーザーがクリックして展開し、もう一度クリックして折りたたむようにします。

ホバーオプションを引き続き使用する場合は、折りたたみをトリガーするイベントを決定する必要があります。明らかに、現在の選択 (マウスが矢印の上にない) では不十分です。

多くの場合、表示されるトリガーブロックと表示されるコンテンツを含むブロックにホバーをアタッチします。このようにして、新しく表示されたコンテンツから移動するまで、コンテンツは折りたたまれません。

score 1 · Accepted Answer

あなたの実際の目標が何であるかわからない場合でも、おそらくdocument.elementFromPoint()方法がここであなたを助けるものです.

のように呼び出されます

if( document.elementFromPoint( event.pageX, event.pageY ) === $('#footer')[0] ) { }

そのコードは、hoveraka mouseenter/mouseleaveハンドラ内で、現在の絶対マウスカーソル X/Y 位置の下にあるノードをノードと比較し#footerます。

2 に答える 2