菜單不與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值。