菜单不与Superfish HTML和CSS一起显示

Question

我发布了我认为之前过于具体的问题。让我用我遇到的一个普遍问题来重述它。

我有一个链接到一个CSS文件的HTML文件。我在同一个目录中的js文件夹中有superfish.js。菜单不出现。

我做了什么：

1. 下载superfish.js并将其放置在JS文件夹
2. 副本superfish.css文件，并把它放在我的.css文件
3. 负荷JS在顶部我的HTML文件

这就是我所能找到的，我应该这样做。我会说这似乎是一个CSS问题，因为当我改变

.sf-menu ul { 
    position: absolute; 
    top:  -999em; 
    width:  10em; /* left offset of submenus need to match (see below) */ 
} 

到

.sf-menu ul { 
    position: absolute; 
    top:  0em; 
    width:  10em; /* left offset of submenus need to match (see below) */ 
} 

菜单出现在左上角。我从superfish复制了水平导航CSS，并且它仍然只是水平显示。那么我错过了其他一些基本步骤吗？

HTML：http://smart-art.org/cadop/index.html

CSS：http://smart-art.org/cadop/oneColFixCtr.css

的index.html显示在左上角的菜单，这是因为我改变了CSS，使-999em到0em ...所以我假设JS是工作，但我完全困惑。

我希望这对我来说太不明确了，因为我使用的是Dreamweaver。我在另一个文件中用CSS单击了一个列布局。从Superfish网站复制了CSS，并将JS文件放入该文件夹中。

任何帮助？

Answer 1

首先，一些建议：

• 当开发一个网页，添加您的JavaScript和CSS小块，所以你明白发生了什么事情之前，你的网页/网站没有达到无法管理的大小。
• 添加新内容时，有时将CSS添加到标记中会有帮助。然后确保问题不是由链接问题引起的。

---

现在你的问题。根据你的页面，它看起来像你的HTML是搞砸了。我所做的只是复制Superfish v1.4.8 example页面的HTML并替换您的菜单。

它看起来像你的菜单缺少菜单的许多必要的类。例如，看一下你的差异顶部菜单元素和样品的之间：

您的代码：<ul class="sf-menu">

示例代码：<ul id="sample-menu-1" class="sf-menu sf-js-enabled sf-shadow">

我还用原来的CSS的.sf-menu ul。

.sf-menu ul { 
     position: absolute; 
     top:  -999em; 
     width: 10em; /* left offset of submenus need to match (see below) */ 
    } 

工作实例：http://jsfiddle.net/HtBUZ/

行动项目使用Superfish v1.4.8 example解决您的页面

1. 纠正你的HTML。

2. 确保你的脚本是正确的。

   1. 您的页面缺少JQuery。

      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
      

   2. 您的页面错误地链接了hoverIntent.js。
3. 将您的CSS恢复为.sf-menu ul的原始-999em值。