Question

我必须承认我完全被这个问题困住了。我一直在网上寻找解决方案，但如果已经解决了这个问题，我会提前道歉。

我正在开发一个网站，它至少需要在IE8上完美运行。我已经禁用了IE6的一些漂亮的东西，并记住它在所有版本中都运行良好。也适用于Firefox，Chrome和Safari。然而，今天，它刚刚决定BREAK。以下是问题：

页面将无法在IE6,7或8中加载。我唯一的猜测就是头部中有一个脚本或某些东西正在停止浏览器。我已经尝试在删除头部中的所有脚本和链接后加载它，但无济于事。这只是一个白页。我该如何解决这个问题？
当用于加载的页面时，顶部导航在所有版本的IE中都被破坏了。在Firefox，Chrome或Safari中，它很好。导航中的每个链接都是<li>，其中包含<a>。当用户滚过<li>时，其下方的相应“聚光灯”图像将通过自定义位jquery进行交换。但现在链接甚至都没有出现。
出于某种原因，朝向底部的图像中的标签链接很少。在正常状态下，他们很好。翻转时，标签会弹出一点并改变颜色。我有border-radius和box-shadow，我也在容器上使用CSS3饼。然而，在翻滚时，角落变黑。它看起来像png没有正确显示，但它们是用CSS制作的。这个问题并没有像恢复基本页面功能那样紧迫，因为我可以恢复使用图像，但这也是一个令人头疼的问题。

在我的办公室，我们在Windows 7上使用IE9，以及一个名为IETester的程序，以便在其他版本中提升网站。我们有一台相当老的计算机本身运行IE6，但结果对所有人来说都是一样的。

这个项目已经接近截止日期，所以要让它刚刚起步和破坏是非常令人痛苦的。如果有人知道这里出了什么问题，请告诉我。该网站的托管地点为：

该页面与一个php include for header.php和footer.php放在一起。

只是让你知道标题中链接的是什么：

<link href="css/style.css" rel="stylesheet" type="text/css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript" ></script>  
<script src="js/libs/modernizr-2.0.6.min.js" type="text/javascript" ></script>
<script src="js/script.js" type="text/javascript" ></script>
<script src="js/plugins.js" type="text/javascript" ></script>
<script src="js/libs/PIE.js" type="text/javascript" ></script>
<!--[if IE 6]>
<link href="css/ie6.css" rel="stylesheet" type="text/css" />
<![endif]-->

在样式中，重置和排版样式表通过@import以菊花链形式显示。它们也在css目录中。

这是我的头文件，从body标签开始：

<body>

    <div id="wrapper">

        <div id="header">

            <div id="masthead"></div>

            <ul class="nav">
                <li class="nav_spacer_left"></li>
                <a href="#" id="nav1"><li class="index"></li></a>
                <a href="##" id="nav2"><li class="works"></li></a>
                <a href="###" id="nav3"><li class="products"></li></a>
                <a href="####" id="nav4"><li class="partners"></li></a>
                <a href="#####" id="nav5"><li class="company"></li></a>
                <a href="######" id="nav6"><li class="contact"></li></a>
                <li class="nav_spacer_right"></li>
            </ul>

            <div id="lights">       
                <div class="nav_light" id="nav1_light"></div>
                <div class="nav_light" id="nav2_light"></div>
                <div class="nav_light" id="nav3_light"></div>
                <div class="nav_light" id="nav4_light"></div>
                <div class="nav_light" id="nav5_light"></div>
                <div class="nav_light" id="nav6_light"></div>
            </div>


        </div><!--! end of #Header -->

    <div class="clear"></div>

        <div id="background">
            <div class="shelf"></div>

            <div class="content">

以下是聚光灯的jQuery，非常基本的东西：

/*  
    Spotlights
*/
$(document).ready(function() {

$('#nav1').hover(function() {
    $('#nav1_light').addClass('nav_light_bright');
        }, function() {
    $('#nav1_light').removeClass('nav_light_bright');
});

$('#nav2').hover(function() {
    $('#nav2_light').addClass("nav_light_bright");
        }, function() {
    $('#nav2_light').removeClass("nav_light_bright");
});

$('#nav3').hover(function() {
    $('#nav3_light').addClass("nav_light_bright");
        }, function() {
    $('#nav3_light').removeClass("nav_light_bright");
});

$('#nav4').hover(function() {
    $('#nav4_light').addClass("nav_light_bright");
        }, function() {
    $('#nav4_light').removeClass("nav_light_bright");
});

$('#nav5').hover(function() {
    $('#nav5_light').addClass("nav_light_bright");
        }, function() {
    $('#nav5_light').removeClass("nav_light_bright");
});

$('#nav6').hover(function() {
    $('#nav6_light').addClass("nav_light_bright");
        }, function() {
    $('#nav6_light').removeClass("nav_light_bright");
});

})

如果要求人们挖掘我的代码让我成为一个混蛋，我再次真诚地道歉。我非常感谢能够帮助我解决这个问题的人，并希望事先说声谢谢。如果它只是一些小小的未封闭的标签或其他东西，请放心，我将至少十分钟头顶。

我在发布问题时遇到了问题，因此我没有链接到这些页面，而是包含了一些脚本。如果你想查看所有的css，它就在我之前链接的网站的/ css /目录中。当然，如果需要，我可以在这里发布更多代码。

Answer 1

修正了它。在我不知情的情况下，这是一个超出doctype的空间！：-O

IE 6,7,8中的整个站点根本没有加载，9中的CSS问题

1 个答案: