0

当鼠标悬停在一个链接上并创建简单的菜单头时，我为显示 div 创建了简单的代码，它的想法是在查看链接时向我显示一个 div，然后我可以查看此 div 并选择我想要的，但实际上我不能选择任何内容，因为如果我没有通过链接，则 div 会一直隐藏

我的代码是这样的：

<style>
#menu_content_head
{
top:125px;
position:absolute;
width:200px;
min-height:100px;
height:auto;
border:1px solid #000000;
background-color:green;
}
</style>


<script>
function menu_head(id)
{

$(document).ready(function() {

$("#h1").hover(function () {
$(".head_m_1").show( "slide", {direction: "up" }, 2000 );
});

$("#h1").mouseout(function () {

$(".head_m_1").hide( "slide", {direction: "up" }, 2000 );
});


});


}
</script>


<div id="web_header_menu_boton">
<a href="#" onmouseover="menu_head('head_m_1');" id="h1">Menu 1</a>
</div>


<div id="menu_content_head" style="display:none;" class="head_m_1">Content 1</div>

JS Fiddle 复制发布的代码。

问题：

1 ) 动画重复了 1 次以上，我不知道为什么.....我使用 stop() ，但我没有工作 2 ) 当我浏览链接时，第一时间没有向我展示 show 的效果div，我需要在其他时间查看链接以进行工作 3）当我通过链接查看 div 隐藏内容时，我无法在 div 显示中选择任何内容

我需要修复的 3 件事，我尝试了，但我不知道该怎么做，不需要更多，不需要复杂的菜单或插件

感谢您的帮助，问候！

4

1 回答 1

0

试试这个小提琴

$(document).ready(function() {

    $("#h1").hover(function() {
        $(".head_m_1").show(2000);
    });

    $("#h1").mouseout(function() {

        $(".head_m_1").hide(2000);
    });
});

首先，您根本不需要 HTML 中的 mouseover 处理程序或 menu_head 函数。其次，不要重载.show()或hide()接受这些论点。检查文档。

也许您正在寻找.slideUp()和它的合作伙伴，.slideDown？

于 2012-11-17T21:36:03.237 回答