Question

为客户创建了一个小导航，打开了一个“站点地图”样式的链接，这种链接很受欢迎，与过去的菜单菜单相反，而且效果很好。

单击时打开，鼠标离开div后隐藏。但是，现在我遇到了一个问题，因为我们已经引入了该导航的锚链接。只有当鼠标离开时它才会消失，页面将转到导航后面请求的锚点链接，但在鼠标离开之前不会消失。

我以为我可以在点击时添加一行来移动它，但这不会做任何事情。我更改了动作以使背景变为红色以确保它是触发它确实如此，但它只是不想调整顶部（我隐藏的方式），因为它执行其他操作。希望有人可以看看，告诉我我错过了什么！谢谢你们

这是javascript

$(document).ready(function () {
$("#nav_hover").click(function () {
    setTimeout(function () {
        $("#nav_features #nav_expanded_nav.expanded_nav").css("top", "95px");
    }, 20);
});
$("#nav_hover").mouseleave(function () {
    setTimeout(function () {
        $("#nav_features #nav_expanded_nav.expanded_nav").css("top", "-800px");
    }, 800);
});

});

这是'扩展导航'从以下位置删除的导航栏：

<nav id="main_nav">
 <ul>
  <a id="nav_hover">
  <li>Nav Option</li>
  </a>
 </ul>
</nav>

这是下拉的扩展导航，我想在点击时隐藏：

<nav id="nav_expanded_nav" class="expanded_nav">
 <ul class="main_catagory_nav">
  <h1>Heading</h1>
  <p>Description</p>
   <li><a href="http://www.theplace.com/link.shtml#anchor">Link 1</a></li>
   <li><a href="http://www.theplace.com/link.shtml#anchor2">Link 2</a></li>
 </ul>
</nav>

这就是我想到的就是我所需要的一切！

$(document).ready(function () {
$("#nav_hover").click(function () {
    setTimeout(function () {
        $("#nav_features #nav_expanded_nav.expanded_nav").css("top", "95px");
    }, 20);
});
$("#nav_hover").mouseleave(function () {
    setTimeout(function () {
        $("#nav_features #nav_expanded_nav.expanded_nav").css("top", "-800px");
    }, 800);
});
$(".nav_expanded_nav a").click(function () {
    setTimeout(function () {
        $("#nav_features #nav_expanded_nav.expanded_nav").css("top", "-800px");
    }, 20);
});


});

但它什么都没做。如果我将iut更改为.css("background", "red")，它确实改变了该div的背景，这至少证实了它是正确的想法。但它不能影响css的“顶部”

单击时隐藏<nav>

0 个答案: