특정 페이지의 하위 메뉴 클래스 숨기기

초보자입니다. 내 사이트의 특정 페이지에서 메뉴 항목 호버의 하위 메뉴 클래스를 숨기려고합니다.특정 페이지의 하위 메뉴 클래스 숨기기

url이 www.mysite.it/login 인 경우 로그인 (메뉴 항목) 호버에서 .submenu를 숨 깁니다.

2017-02-28 Corrado Cocò Trombetta

body 클래스의 itemId 매개 변수를 출력하는 것이 더 쉬울 수 있으므로 템플릿 주 파일 (일반적으로 /templates/something/index.php)을 편집하고 <body 태그를 찾은 다음 다음과 같이 변경하십시오. 사용자 정의 CSS 규칙에서 요구하는 해당 itemId (1302)이있다, 당신은 단순히 탐색을 대상으로하는 데 사용할 수 있습니다에이 수정 프로그램을 소개하고자 다음

<body class="your other classes here pageid-1302">

페이지를 가정으로

<body class="your other classes here <?php 
    $app = JFactory::getApplication(); 
    $menu = $app->getMenu()->getActive()->id; 
    echo "pageid-$itemId" 
?>"

이 렌더링 :

body.pageid-1302 nav.main > ul > li:nth-child(3):hover > ul > li:nth-child(2) { 
    display:none; 
}

(조심하십시오 :이 클래스는 하위 메뉴 만 대상으로하는 정확한 경로를 찾아야합니다. 또한 클래스가 다른 경우가 있으므로 모바일로 테스트해야합니다.

이 솔루션은 스크립트를 사용하지 않습니다. 당신이 숨기고 싶은 하위 메뉴가 호버에 올려 진 항목의 자식이라면 쉽게 작동 할 것입니다; 그러나 항목이 다른 곳에 있으면 실제로 스크립트가 필요합니다. 이 경우, 그에 따라 호버 이벤트에 함수를 첨부하고 행동해야 할 것 : 그것은 그래서 마지막으로

jQuery(function() { 
    // now the document is loaded 
    jQuery('.firstmenuselector').on('hover',function() { 
    // the user hovered the element; 
    jQuery('.submenuselector').hide(); 
    },function() { 
    // the user exited the element; 
    jQuery('.submenuselector').show(); 
    }); 
});

, 당신은 관련 메뉴 항목에 클래스를 추가 할 수 있습니다 : jQuery를 가정 할 수 있습니다 CSS 또는 jQuery 선택기를 사용하여보다 쉽게 타겟팅 할 수 있습니다.

출처

2017-02-28 11:02:19

대단히 감사합니다.이 솔루션을 사용해 보겠습니다. –

특정 페이지의 하위 메뉴 클래스 숨기기

답변

관련 문제