我正在尝试创建一个简单的 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),因为我希望菜单出现在它下面并保留登录按钮的功能以更改“顶部菜单”内的内容。
但是使用mouseleave,只要光标进入登录元素,顶部菜单就会关闭,我希望它保持打开状态。
所以换句话说,我希望 topmenu 元素保持可见,即使您将鼠标悬停在其上方的登录元素上。
我怎样才能做到这一点?我尝试使用此代码,但它不起作用:/
$('#login').mouseenter(function(){
if ($('#topmenu').is(':visible')) {
alert('h');
$( '#topmenu' ).css('display', 'block');
};
});