jQuery Scroll To 활성 버튼

Question

내 사이트 http://www.iancockram.com은 (는) 한 페이지 포트폴리오입니다. 내가 해결하려고하는 문제는 강조 표시하기 위해 활성화 된 메뉴 버튼을 갖고 싶습니다. ..

나는 그것을 구성하는 것을 시도했다, 그러나 결코 작동하지 않은 수

**JQUERY** 
    //scrollTo 
    $(document).ready(function(){ 
    $('nav ul li a').click(function(){ 
    var el = $(this).attr('href'); 
    var elWrapped = $(el); 
    scrollToDiv(elWrapped, 86); 
    return false; 
    }); 

    function scrollToDiv(element,navheight){ 
    var offset = element.offset(); 
    var offsetTop = offset.top; 
    var totalScroll = offsetTop-navheight; 
    $('body,html').animate({ 
      scrollTop: totalScroll 
    }, 500); 
    } 
    });//scrollTo end 


    **HTML** 
    <nav> 
    <ul id="top-menu"> 
     <div id="logo"><img src="furniture/logo.png" width="242" height="90" alt="iancockram.com" title="iancockram.com"></div> 
     <li class="button"> <span class="menutext"><a href="#contact">Contact</a></span></li> 
     <li class="button"> <span class="menutext"><a href="#extra">Extra</a></span></li> 
     <li class="button"> <span class="menutext"><a href="#portfolio">Portfolio</a></span></li> 
     <li class="button"> <span class="menutext"><a href="#about">About</a></span></li> 
    </ul> 

} 당신이 당신이 사용하는 요소를 클릭 할 같은 스타일을 추가하는 데 필요한 모든의

Answer 1

추가 CSS 클래스는 다음과 같이 을 클릭 링크의 온 클릭 이벤트에 일부 CSS 클래스를 추가 : - 나는 onclick 이벤트가 작동하게 관리해야

$(document).ready(function(){ 
    $('nav ul li a').click(function(){ 
    $('nav ul li a').removeClass(); 
    $(this).addClass('active'); 
    return false; 
    }); 
}); 

Answer 2

첫째 : 가져가 .

스크롤 할 때도 메뉴 항목을 하이라이트하려면 $ (window) .scroll() 이벤트를 설정하고 높이가 div 중 하나의 위와 아래 사이에 있는지 확인하고 다음과 같은 스타일을 적용해야합니다. .

Answer 3

는

Answer 4

!

이제는 window.scroll 기능으로 강조 표시된 메뉴 항목을 가지고 있다는 아이디어에 착수했습니다.

div를 전달하면 경고 표시가 표시됩니다. 하지만 스타일에 영향을주기 위해 여러 div를 전달할 때 어떻게 코드를 작성합니까?

$(function(){ 
    $(window).scroll(function(){ 
    var aPortfolio = $('.portfoliowrapper').height(); 
    if($(this).scrollTop()>=aPortfolio){ 
     alert('portfolio just passed.'); 
    } 
    }); 
});