Bootstrap下拉列表在IE8中无效

Question

我正在使用Bootstrap框架来设计我的网站。 我在导航中有下拉工作，但是从IE8中的一些未知原因下拉列表不起作用。 单击“关于我们”链接时，下拉列表未完全显示。 这只发生在IE8中。

它在其他浏览器中工作正常。

你可以在这里查看：

https://dl.dropboxusercontent.com/u/52725754/fightback-responsive/index.html

有人可以帮忙解决这个问题吗？

Answer 1

以下是Bootstrap GitHub论坛上此问题的解决方案： https ： //github.com/twitter/bootstrap/issues/6548 。 似乎本机IE8有时会由于filter：参数而破坏，该参数在整个Bootstrap css中用于渐变等。解决方案是添加filter：none！important; 到像.navbar或.navbar-inner这样的元素。 前者为我解决了。

Answer 2

我使用bootstrap 3.3.4在IE8下拉菜单时出现问题。 我设法通过使用jquery版本1.11.2而不是jquery版本2+来解决问题。

Answer 3

使用bootstrap-theme（在IE8和IE9中）存在问题，请参阅此主题 。

要确认这是您的问题，

• 检查下拉列表是否适用于Bootstrap的导航栏示例
• 注释掉包含bootstrap-theme.min.css 。 然后应该出现下拉菜单。

我使用了以下解决方法（在第一个链接中建议）：

• 使用bootstrap-theme.css而不是.min版本
• 注释掉行filter: progid:DXImageTransform.Microsoft.gradient(...)

Mark Otto还建议将导航栏的内容包装在另一个div中，然后添加样式调整。

希望这可以帮助

Answer 4

我遇到了使用bootstrap版本2.3.2在IE8中没有显示的下拉列表的问题。

阅读了几个feed后，我得到了这个答案，将它添加到IE8和7的条件样式表中。

/ **解决了IE8兼容模式下拉的问题** /

.navbar-inner{filter:none;}

希望这可以帮助 ：）

Answer 5

IE8 fix for twitter bootstrap responsive menu:

For me the **menu-toggle** button appeared in IE8 so to make it appear as normal menu I used

<!--[if lt IE 9]>
<script src="http://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="http://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->

And a seprate CSS for IE8 containing the below classes 
<!--[if lt IE 9]>
    <link rel="stylesheet" type="text/css" href="css/ie8.css" media="screen" />
  <![endif]-->

Include the below classes inside the ie8.css file

.navbar-header, .navbar-collapse, .collapse{display:none;}
.collapseie8 ul li{ float:left; }
.navbar-nav, .collapse{ display:block; }
    .navbar-inverse.nav li.dropdown.open > .dropdown-toggle,
    .navbar-inverse.nav li.dropdown.active > .dropdown-toggle,
    .navbar-inverse.nav li.dropdown.open.active > .dropdown-toggle, .nav, .navbar, .navbar-inverse.navbar-inner { 

        filter: none!important;
        background-image: none;
    }

 <div id="defaultmenu" class="navbar-collapse collapse collapseie8">
                <ul class="nav navbar-nav ">