Question

我仍然遇到一些问题，让我的Twitter-Bootstrap页面在IE8中正确显示桌面视图。我一直关注这里的一些主题，但投票通知的建议对我不起作用。

使用建议的元标记

<meta http-equiv="X-UA-Compatible" content="IE=edge">

包含本地版本的bootstrap.css，html5shiv.js，respond.js，ie8-responsive-file-warning.js

这是我的主管部分：

<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="SunTrust Equity Line Options">
<meta name="author" content="">
<link rel="shortcut icon" href="favicon.ico">

<title>SunTrust &ndash; Your Equity Line is Maturing. What are your options?</title>

<!-- Bootstrap core CSS -->
<link href="dist/css/bootstrap.css" rel="stylesheet">

<!-- Just for debugging purposes. Don't actually copy this line! -->
<!--[if lt IE 9]><script src="dis/js/ie8-responsive-file-warning.js"></script><![endif]-->

<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
  <script src="dist/js/html5shiv.js"></script>
  <script src="dist/js/respond.js"></script>
<![endif]-->

结束：

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="dist/js/tooltip.js"></script>
<script src="dist/js/popover.js"></script>
<script>
$("a[rel=popover]")
    .popover()
    .click(function(e) {
        e.preventDefault();
     });
 </script> 
</body>
</html>

Answer 1

尝试使用bootstrap的本地副本。这解决了IE8的问题。

Answer 2

好吧，我已经问了好几个人并且读了很多，但仍然没有答案。似乎解决它的唯一方法是调用仅IE8样式表来使事情正确显示。

事件getbootstrap.com示例在IE8中不起作用，它们在IE8中的移动优先级相同。

真的很遗憾，因为我无法在大多数项目中使用它。

Answer 3

始终确保在加载jQuery后加载以下脚本。

特别是在WordPress和其他框架中，有些人倾向于在结束标记之前包含jQuery，因此在html5shiv.js和respond.js脚本之后，这会导致IE8中的问题

 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 

Answer 4

我发现你在一个地方使用“dis / js / ...”而在其他地方使用“dist / js /”。你确定你的路径是正确的吗？我会仔细检查浏览器是否实际上正在加载您认为其加载的文件。

或者它可能是条件注释的重复，请尝试使用grins :(当然，如果“dis”或“dist”不正确，也会修复以下代码中的路径）

<!-- Just for debugging purposes. Don't actually copy this line! -->
<!--[if lt IE 9]>
    <script src="dis/js/ie8-responsive-file-warning.js"></script>
    <script src="dist/js/html5shiv.js"></script>
    <script src="dist/js/respond.js"></script>
<![endif]-->

我也不熟悉ie8-responsive-file-warning.js，如果所有其他方法都无法确定它与respond.js没有冲突，我会尝试删除它。就此而言，删除html5shiv也只是为了排除所有冲突。

Answer 5

我们发现在“head”部分之外的css链接（基本上是用于bootstrap css）破坏了response.js能够根据需要提供必要的媒体查询支持。确保所有css链接都在“head”部分中。

Twitter-Bootstrap respond.js不适用于IE8

5 个答案: