Twitter bootstrap 调整大小后下拉菜单不起作用

我从bootstrap开始，制作了一个小小的html模板，其中只有一个带有下拉项的菜单头

问题是，当我将窗口调整到足够小以强制响应菜单折叠后，请在折叠时使用下拉菜单导航，在我最大化窗口后，下拉菜单项停止工作，显示一个滚动以查看内容，而不是下拉

示例代码？只需从引导中尝试导航栏模板：

这个问题有没有已知的解决方法

在Firefox和Chrome中测试。

更新

在引导的CSS之后添加以下内容：

@media (min-width: 768px) 
{   
    .navbar-collapse.in{ overflow-y:visible;}
}

-结束更新

是的，这看起来很奇怪，在课堂上重新调整尺寸后仍然有效果

您可以使用jquery删除该类：

$(document).ready(function() 
{
    var $window = $(window);

        // Function to handle changes to style classes based on window width
        function checkWidth() {

        if ($window.width() >= 768) {
            $('.navbar-collapse').removeClass('in').addClass('collapse');
        }
    }

    // Execute on load
    checkWidth();

    // Bind event listener
        $(window).resize(checkWidth);
});   

从以下位置调整代码大小，更好的解决方案：

也许还可以使用媒体查询在断点上方重置.in类的屏幕宽度

这似乎是一个bug，请参阅：

更新

在引导的CSS之后添加以下内容：

@media (min-width: 768px) 
{   
    .navbar-collapse.in{ overflow-y:visible;}
}

-结束更新

是的，这看起来很奇怪，在课堂上重新调整尺寸后仍然有效果

您可以使用jquery删除该类：

$(document).ready(function() 
{
    var $window = $(window);

        // Function to handle changes to style classes based on window width
        function checkWidth() {

        if ($window.width() >= 768) {
            $('.navbar-collapse').removeClass('in').addClass('collapse');
        }
    }

    // Execute on load
    checkWidth();

    // Bind event listener
        $(window).resize(checkWidth);
});   

从以下位置调整代码大小，更好的解决方案：

也许还可以使用媒体查询在断点上方重置.in类的屏幕宽度

---

这似乎是一个bug，请参见：

另一个答案对我不起作用，因为collapse类添加了一个显示：none；也许是另一个版本的引导。对我有效的解决方案是将以下内容添加到您的响应CSS中：

@media screen and (min-width: 768px){
    .collapse{ display:block;}
}

---

对我来说，问题发生在我打开然后关闭折叠的菜单，然后调整大小。希望这有帮助。

另一个答案对我不起作用，因为collapse类添加了一个显示：无；也许是另一个版本的引导。对我有效的解决方案是将以下内容添加到您的响应CSS中：

@media screen and (min-width: 768px){
    .collapse{ display:block;}
}

---

对我来说，问题发生在我打开然后关闭折叠的菜单，然后调整大小。希望这能有所帮助。

强制将折叠元素的自动高度设置在断裂点以上对我很有效

在切换按钮上找到id或类，例如数据目标=.navbar-ex1-collapse，并使用最小宽度作为断点：

@media screen and (min-width: 768px){
    .navbar-ex1-collapse { height:auto !important;}
}

---

强制将折叠元素的自动高度设置在断点上方对我很有效

在切换按钮上找到id或类，例如数据目标=.navbar-ex1-collapse，并使用最小宽度作为断点：

@media screen and (min-width: 768px){
    .navbar-ex1-collapse { height:auto !important;}
}