2013-10-31 3 views
1

이 js를 작성 했으므로 메뉴는 응답하지만 j가 사용 가능하지 않으면 중단되지 않습니다.요청시 반응 형 메뉴 열기

나는 자신의 nav 요소 안에 각각 2 개의 메뉴 목록을 가지고 있습니다. 태블릿 및 휴대 기기의 경우 메뉴 버튼 (목록의 첫 번째 항목) 만 표시하고 메뉴 버튼을 누를 때까지 목록은 표시되지 않게하고 싶습니다.

현재 페이지를 열면 첫 번째 목록이 숨겨 지지만 다른 목록은 영구적으로 표시됩니다. 그러나 어느 메뉴 버튼을 클릭해도 첫 번째 목록을 보여주는 것과 동일한 작업을 수행합니다. nav도 ID 또는 클래스를 가지고 있지 않습니다.

목록 중 하나만 응답하는 이유는 무엇입니까?

이것은 JS입니다 (그 머리에)

당신이 기본 토글 탐색 후가는 것처럼 소리
function showLists() { 
$('.nav').show(); 
$(".menu").hide(); 
} 
$(document).ready(function() { 
if ($(window).width() < 450) { 
    $('.nav').hide(); 
    $(".menu").click(function() {(
     showLists() 
     )}) 
    } 
}); 
+0

"어느 nav도 id 나 class를 가지고 있지 않습니다."물론 모든'nav' 요소를 선택하려면'$ ("nav")'를 사용해야합니다. '$ (". nav")'는 "nav 클래스를 가진 모든 요소"를 의미합니다. 그리고 btw 당신은 바이올린 plz http://jsfiddle.net/을 만들 수 있습니까 –

+0

고마워. 그게 정말 도움이되었습니다. 모든 링크 요소에 nav 클래스를 부여했음을 알게되었습니다. 약간 창피하지만 매우 유용합니다. –

답변

0

. 기본적이고 더욱 향상된 대응 형 솔루션의 시작점은 RWD Patterns by Brad Frost입니다.

또한 대부분의 솔루션에서 하나의 탐색 목록 만 정의하고 CSS와 JS를 사용하여 반응 적으로 동작하도록 처리해야합니다.