AJAX Nav在Mac或PC上无法在Windows或Safari中运行

Question

我有一个菜单，将通过jQuery加载，但作为一个单独的html文件进行维护，以便能够在一个简单的地方更新它，而不是在任何时候发生更改时在每个页面上更新。菜单WAS在每个浏览器中都能正常工作，然后它突然停止在Windows上的所有浏览器和Mac或Windows上的Safari中工作。它仅适用于Mac上的Chrome和FF，其余只是填充文本，但链接不活动。我不确定我是否还没有在头部声明正确的jQuery版本（或者如果我改为最新版本，它会破坏我在其他情况下看到的其他东西） - 我已经加载了1.7和1.8。我的代码或结构在哪里出错了？请指教，谢谢。 这是页面：http://devious.humanalbatross.com/（仍在开发中，因此是'devious'子域名...并且链接的页面会因为它们不是jQuery填充它的菜单而被破坏。

这是我的代码：   - 这就是导航出现在任何实际页面上的地方

        <nav id="menu">
     <div class="clear"></div>
       </nav>
         <script type="text/javascript">
           $("#menu").load("main-nav.html");
         </script>

- 这是jQuery从中提取的实际HTML文件（main-nav.html）中的标记：

                                <ul class="mainmenu">
                                <li><a href="http://www.humanalbatross.com/sonica">Sonica</a></li>
                                <li><a href="http://www.humanalbatross.com/wavywinds">Wavywinds</a></li>
                                <li><a href="http://www.humanalbatross.com/staticmotion">StaticMotion</a></li>
                                <li><a href="http://www.humanalbatross.com/porousmind">PorousMind</a></li>
                                <li><a href="http://www.humanalbatross.com/contact">Speak To Me</a></li>
                                <div class="clear">
                                </div>
                            </ul>

Answer 1

您的问题与您的javascript实施无关，但与您的css无关。

将以下样式附加到style.css（第101行）

header {
   /* other styles */
   position: relative;
   z-index: 10;
}

此问题是由section#homeContent哪个保证金设置为margin: -100px 0 0 0;并覆盖您的header引起的。看一下概述问题的截图。

我的css将元素header的默认堆栈顺序更改为10.所以基本上您的标题现在位于homeContent之上。