簡単な jquery メニューを作成しようとしていますが、問題が発生します。これが私のスクリプトです:
<script>
$(function(){
$('#tm-u, #tm-e, #tm-n').click(function(){
$( '#topmenu' ).css('display', 'block');
});
$('#topmenu').mouseleave(function(){
$(this).css('display', 'none');
});
});
</script>
私のhtml構造はこれです:
<div id="login">
<a href="#tm-u">1</a>
<a href="#tm-e">1</a>
<a href="#tm-n">1</a>
</div
<div id="topmenu">
stuff
</div>
問題は、メニューをその下に表示し、ログインボタンの機能を維持して「トップメニュー」内のコンテンツを変更するため、トップメニューがログイン要素の下に表示されることです (z-index を使用)。
ただし、マウスリーブを使用すると、カーソルがログイン要素に入るとトップメニューが閉じ、開いたままにしたい。
言い換えれば、topmenu 要素の上にある login 要素にカーソルを合わせても、topmenu 要素が表示されたままになるようにしたいと考えています。
これどうやってするの?このコードを使ってみましたが、うまくいきません:/
$('#login').mouseenter(function(){
if ($('#topmenu').is(':visible')) {
alert('h');
$( '#topmenu' ).css('display', 'block');
};
});