CSS 해당 섹션을 클릭 할 때까지 메뉴가 확장되지 않습니다.

아래 링크의 탐색과 같이 Wordpress 탐색을 만들려고합니다. CSS 해당 섹션을 클릭 할 때까지 메뉴가 확장되지 않습니다.

는 기본적으로 탐색 확장하지 않습니다. 사용자가 해당 섹션 인 경우에만 하위 링크가 표시됩니다. 위 링크에서 예는 "Service" 섹션입니다. 하위 링크는 "Service"을 클릭 한 경우에만 표시됩니다. 클라이언트는 Dreamweaver에서 Dreamweaver 템플릿과 편집 가능 영역을 사용하여이를 수행했지만 Wordpress에서는 작동하지 않습니다.

도움을 주시면 감사하겠습니다. 내비게이션을 시도했지만 하위 링크는 모두 아래 링크처럼 표시됩니다. 도움이 모든 사람에게

http://johnwp.annapolisbook.com/?page_id=6

사전에 감사합니다.

출처

2013-04-30 danny

이런 식으로 뭔가 '해야'작업 (당신은 선택기를 조정해야 할 수도 있습니다) :

.menu ul ul { 
    display: none; 
} 
.menu ul .current_page_item ul, .menu ul .current_page_ancestor ul { 
    display: block; 
}

여기서 핵심은 모든 하위 메뉴 .menu ul ul을 숨기고을 보여주기 위해 부모 요소에 .current_page_item를 사용하는 것입니다

올바른 하위 메뉴.

출처

2013-04-30 07:18:45 mikedidthis

위의 솔루션은 실제로 잘 작동합니다. 유일한 것은 하위 탐색에서 링크를 클릭하면 다시 축소됩니다. 하위 탐색을 클릭하면 열어 두는 방법에 대한 제안이 있습니까? 예를 들어 아래 링크에서 '서비스'를 클릭 한 다음 '디자인'을 클릭하면 링크 구조가 열린 상태로 유지됩니다. http://workableweb.com/_pages/serv_redesign.htm 하지만 이제 Wordpress 사이트에서 하위 링크를 클릭하면 사라집니다. 예를 들어, "Lost Fleet Series"를 클릭 한 다음 "Guardian에서 발췌"를 클릭하면 하위 링크가 사라집니다. http://johnwp.annapolisbook.com/ 제안 사항이 있으십니까? – danny

의견 요구 사항을 반영하도록 답변을 업데이트했습니다. – mikedidthis

나는 그 일을 사과한다! – danny

가장 쉬운 방법과 같이, 신체 또는 포장 요소를 현재 페이지의 ID를 제공하는 것입니다 :

<ul class="nav"> 
    <li>Services</li> 
    <li class="nav-section services-section"> 
     <a href="#">My link</a> 
    </li> 
</ul>

<body id="services">

그리고 목록 항목 클래스를, 그는 기본적으로 숨겨져 있습니다

그런 다음 CSS에서 찾아 :

.nav-section { display: none; } 
#services .services-section { display: block; }

물론 체크인과 같은 동적 인 방법이있다 g를 PHP에서 각 페이지에 대해 사용하지만이 방법은 빠르고 적합한 솔루션이라고 생각합니다.

출처

2013-04-30 07:20:23 casraf

답변 해 주셔서 감사합니다. 불행히도 코드가 Wordpress에서 구동되기 때문에 실제로 코드를 편집 할 수 있다고 생각하지 않습니다. 아래는 현재의 CSS와 Wordpress가 테마에 삽입하는 HTML입니다. – danny

이것은 WordPress의 경우 테마를 자유롭게 편집 할 수 있습니다. 새 테마를 만드는 동안 변경하려는 파일을 삽입하고 기본 테마에서 내용을 복사하여 원하는 내용 만 변경할 수 있습니다. 테마 폴더에없는 파일은 기본값에서 가져옵니다. 또한 그렇다면 각 페이지에 식별자가 가능한 선택기가 있는지 확인한 다음 원하는 변경 사항을 선택하는 방법을 찾으려고합니다. – casraf

CSS 해당 섹션을 클릭 할 때까지 메뉴가 확장되지 않습니다.

답변

관련 문제