메뉴가 Superfish HTML 및 CSS로 표시되지 않음

Question

이전에 너무 구체적인 질문이었던 것을 게시했습니다. 내가 가지고있는 일반적인 문제로 다시 말해 보자.

나는 CSS 파일에 링크 된 하나의 html 파일을 가지고 있습니다. 동일한 디렉토리에있는 js 폴더에 superfish.js가 있습니다. 메뉴가 나타나지 않습니다.

1. 다운로드 superfish.js과의 정상에
2. 부하 JS를 JS 폴더
3. 사본 superfish.css 파일에 배치하고 내 .css 파일에 배치 : 내가 무슨 짓을

   내 html 파일

그게 전부 내가 할 수있는 찾을 수 있습니다. 내가

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

메뉴가 왼쪽 상단에 표시됩니다에

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

을 변경할 때 때문에, 그것은 CSS 문제처럼 보인다 말할 것입니다. 나는 superfish에서 수평 nav CSS를 베끼고 아직도 수평하게 단지 전시한다. 그래서 나는 다른 기본적인 단계를 놓쳤는가?

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

: 나는 -999em에 0em을 만들기 위해 CSS를 변경하기 때문에 http://smart-art.org/cadop/oneColFixCtr.css

index.html는 왼쪽 상단의 메뉴를 보여주고,이 때문에 내가 JS는 가정입니다 ... 일하는,하지만 난 완전히 당황 스럽다.

Dreamweaver를 사용하면서 나에게 너무 특이하지 않기를 바랍니다. 다른 파일에서 CSS로 한 열 레이아웃을 클릭했습니다. Superfish 웹 사이트에서 CSS를 복사하고 폴더에 JS 파일을 저장합니다.

어떤 도움이 필요합니까?

Answer 1

첫째, 몇 가지 제안 :

• 가 페이지를 개발, 당신은 무슨 일이 일어나고 있는지 이해하기 전에 그래서 당신의 페이지/사이트가 관리 할 수없는 크기로 성장하지 않는 작은 덩어리에서 자바 스크립트와 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">

가 나는 또한 .sf-menu ul의 원래 CSS를 사용했다.

.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. 는 .sf-menu ul의 원래 -999em 값에 CSS를 되돌립니다.