IE9无法加载响应布局 [英] IE9 Fails to load responsive layout
本文介绍了IE9无法加载响应布局的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
更新1：
这看起来是一个问题，只有当我构建和发布到IIS。在visual studio中运行，没有问题。 IE9正确呈现。
IE9坏了，我不知道如何做任何真正的测试。我的网站正确加载到IE8，10和11，Chrome，Firefox和Opera，但不是IE9。
这是它应该是什么样子它在大多数浏览器中显示）：
这是在IE 9中发生的情况（顶部的白色栏是应隐藏的移动菜单）：
到目前为止，我唯一的工具是IE测试仪，其中（如果它报告错误）我不知道如何查看。 IE9模式在IE11实际上看起来不错（虽然我收到客户的投诉，所以我知道IE9实际上是破碎的）
这是我在我的布局中的资源：
@ Styles.Render（〜/ bundles / themes / crisp / css）
@ Scripts.Render（〜/ bundles / jquery）
@ Styles.Render（〜/ bundles / less）
@ Scripts.Render（〜/ bundles / modernizr ）
和bundleconfig
public class BundleConfig
{
//有关Bundling的详细信息，请访问http://go.microsoft.com/fwlink/?LinkId= 254725
public static void AddDefaultIgnorePatterns（IgnoreList ignoreList）
{
if（ignoreList == null）
throw new ArgumentNullException（ignoreList）;
ignoreList.Ignore（*。intellisense.js）;
ignoreList.Ignore（* - vsdoc.js）;
ignoreList.Ignore（*。debug.js，OptimizationMode.WhenEnabled）;
//ignoreList.Ignore(\"*.min.js，OptimizationMode.WhenDisabled）;
//ignoreList.Ignore(\"*.min.css，OptimizationMode.WhenDisabled）;
}
public static void RegisterBundles（BundleCollection bundles）
{
bundles.IgnoreList.Clear（）;
AddDefaultIgnorePatterns（bundles.IgnoreList）;
bundles.Add（new ScriptBundle（〜/ bundles / jquery）。Include（
〜/ Scripts / jquery- {version} .js））;
/*bundles.Add(new ScriptBundle（〜/ bundles / jqueryui）。Include（
〜/ Scripts / jquery-ui- {version} .js））;
bundles.Add（new ScriptBundle（〜/ bundles / jqueryval）。Include（
〜/ Scripts / jquery.unobtrusive *，
〜/ Scripts / jquery.validate *））; * /
//使用Modernizr的开发版本开发和学习。然后，当你
//准备好生产时，使用http://modernizr.com上的构建工具来选择你需要的测试。
bundles.Add（new ScriptBundle（〜/ bundles / modernizr）。Include（
〜/ Scripts / modernizr- *））;
/*bundles.Add(new StyleBundle（〜/ Content / css）。Include（〜/ Content / site.css））;
bundles.Add（new StyleBundle（〜/ Content / themes / base / css）。Include（
〜/ Content / themes / base / jquery.ui.core.css ，
〜/ Content / themes / base / jquery.ui.resizable.css，
〜/ Content / themes / base / jquery.ui.selectable.css，
〜/ Content / themes / base / jquery.ui.accordion.css，
〜/ Content / themes / base / jquery.ui.autocomplete.css，
〜/ Content / themes /base/jquery.ui.button.css，
〜/ Content / themes / base / jquery.ui.dialog.css，
〜/ Content / themes / base / jquery.ui .browser.css，
〜/ Content / themes / base / jquery.ui.tabs.css，
〜/ Content / themes / base / jquery.ui.datepicker.css
〜/ Content / themes / base / jquery.ui.progressbar.css，
〜/ Content / themes / base / jquery.ui.theme.css））; * /
bundles.Add（new StyleBundle（〜/ bundles / themes / crisp / css）。Include（
〜/ Content / themes / crisp / css / bootstrap.css，
〜/ Content / themes / crisp / css / style.css，
〜/ Content / themes / crisp / css / socialicoregular.css，
〜/ Content / themes / crisp /css/font-awesome.css，
〜/ Content / themes / crisp / css / hero-equal-thumb-gallery.css，
〜/ Content / themes / crisp / css /tabs-toggle.css，
〜/ Content / themes / crisp / css / portfolio.css，
〜/ Content / themes / crisp / css / blog.css，
〜/ Content / themes / crisp / css / gallery-folio-masonry.css，
〜/ Content / themes / crisp / js / fancybox / source / jquery.fancybox.css，
〜/ Content / themes / crisp / css / header-1.css））;
bundles.Add（new ScriptBundle（〜/ bundles / themes / crisp / js）。Include（
〜/ Content / themes / crisp / js / bootstrap.min.js ，
〜/ Content / themes / crisp / js / custom.js））;
bundles.Add（new LessBundle（〜/ bundles / less）。Include（
〜/ Content / NSA.less））;
}
}
我不确定要提供什么其他信息
（我认为）相关的CSS - 在一个要点，以防止它变得冗长https://gist.github.com/anwyatt/11183367
解决方案
我的第一个猜测将是奇怪的模式，这是一个主要的痛苦在IE为我.. 。
Update 1:
This looks to be a problem only when I build and publish to IIS. Running in visual studio, there are no issues. IE9 renders correctly.
IE9 is broken, and I don't know how to do any real testing. My site loads correctly for IE8, 10, and 11, Chrome, Firefox, and Opera, but not IE9.
This is what it is supposed to look like (and how it looks in most browsers):
This is what happens in IE 9 (the white bar at the top is for the mobile menu which should be hidden):
So far my only tool has been IE tester, which (if it is reporting errors) I can't figure out how to view. IE9 Mode in IE11 actually looks fine (though I have received complaints from clients so I know IE9 actually is broken)
Here is the order I am loading in the assets in my layout:
@Styles.Render("~/bundles/themes/crisp/css")
@Scripts.Render("~/bundles/jquery")
@Styles.Render("~/bundles/less")
@Scripts.Render("~/bundles/modernizr")
and the bundleconfig
public class BundleConfig
{
// For more information on Bundling, visit http://go.microsoft.com/fwlink/?LinkId=254725
public static void AddDefaultIgnorePatterns(IgnoreList ignoreList)
{
if (ignoreList == null)
throw new ArgumentNullException("ignoreList");
ignoreList.Ignore("*.intellisense.js");
ignoreList.Ignore("*-vsdoc.js");
ignoreList.Ignore("*.debug.js", OptimizationMode.WhenEnabled);
//ignoreList.Ignore("*.min.js", OptimizationMode.WhenDisabled);
//ignoreList.Ignore("*.min.css", OptimizationMode.WhenDisabled);
}
public static void RegisterBundles(BundleCollection bundles)
{
bundles.IgnoreList.Clear();
AddDefaultIgnorePatterns(bundles.IgnoreList);
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-{version}.js"));
/*bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
"~/Scripts/jquery-ui-{version}.js"));
bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
"~/Scripts/jquery.unobtrusive*",
"~/Scripts/jquery.validate*"));*/
// Use the development version of Modernizr to develop with and learn from. Then, when you're
// ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
"~/Scripts/modernizr-*"));
/*bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css"));
bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
"~/Content/themes/base/jquery.ui.core.css",
"~/Content/themes/base/jquery.ui.resizable.css",
"~/Content/themes/base/jquery.ui.selectable.css",
"~/Content/themes/base/jquery.ui.accordion.css",
"~/Content/themes/base/jquery.ui.autocomplete.css",
"~/Content/themes/base/jquery.ui.button.css",
"~/Content/themes/base/jquery.ui.dialog.css",
"~/Content/themes/base/jquery.ui.slider.css",
"~/Content/themes/base/jquery.ui.tabs.css",
"~/Content/themes/base/jquery.ui.datepicker.css",
"~/Content/themes/base/jquery.ui.progressbar.css",
"~/Content/themes/base/jquery.ui.theme.css"));*/
bundles.Add(new StyleBundle("~/bundles/themes/crisp/css").Include(
"~/Content/themes/crisp/css/bootstrap.css",
"~/Content/themes/crisp/css/style.css",
"~/Content/themes/crisp/css/socialicoregular.css",
"~/Content/themes/crisp/css/font-awesome.css",
"~/Content/themes/crisp/css/hero-equal-thumb-gallery.css",
"~/Content/themes/crisp/css/tabs-toggle.css",
"~/Content/themes/crisp/css/portfolio.css",
"~/Content/themes/crisp/css/blog.css",
"~/Content/themes/crisp/css/gallery-folio-masonry.css",
"~/Content/themes/crisp/js/fancybox/source/jquery.fancybox.css",
"~/Content/themes/crisp/css/header-1.css"));
bundles.Add(new ScriptBundle("~/bundles/themes/crisp/js").Include(
"~/Content/themes/crisp/js/bootstrap.min.js",
"~/Content/themes/crisp/js/custom.js"));
bundles.Add(new LessBundle("~/bundles/less").Include(
"~/Content/NSA.less"));
}
}
I'm not really sure what other information to provide, but feel free to ask!
The (I think) relevant CSS - in a gist to keep this from getting lengthy
https://gist.github.com/anwyatt/11183367
解决方案
My first guess would be the quirks mode, that has been a major pain in IE for me...
这篇关于IE9无法加载响应布局的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
