引导背景变暗与下拉事件

Question

提前感谢任何可以帮助我的人。

当导航菜单下降时，我试图让网站的背景变暗。

当我将鼠标悬停在菜单上时，我可以让它工作得很好，但不仅仅是菜单丢弃。

我有一个div“黑暗”，不透明度为70％。

这是我的javascript：

$('.dropdown-menu').hover(function(){
    $('#darkness').fadeTo(200, 1);
}, function(){
    $('#darkness').fadeTo(200, 0, function(){
        $(this).hide();
    });
});

Answer 1

Greg Fielding 你好。

执行此操作的一种好方法是使用 toggleClass 并在内容周围放置一个包装器。

以下是我为此示例使用的代码。

$(document).ready(function(){
    $(".collapsed").click(function(){
    $("#coverthishere").toggleClass("coverall");
    });
}); 

以下是此示例的 Fiddle 。

您会看到我在此处使用菜单类已折叠作为触发器 我定位ID coverthishere 以添加/删除class .coverall 。

这仍然允许菜单位于顶部，封面位于菜单下方，但位于正文顶部。

希望这会有所帮助。