Twitter Bootstrap Scrollspyは常に最後の要素を強調表示します

何がうまくいかず、なぜスクロール中に最後のセクションだけが選択されるのか分かりません。Twitter Bootstrap Scrollspyは常に最後の要素を強調表示します

<body data-spy="scroll" data-target="#homeToolbar" data-offset="50"> 
    <nav class="navbar navbar-default navbar-fixed-top" id="homeToolbar"> 
    <div class="container-fluid"> 
     <div class="navbar-header"> 
     <a class="navbar-brand" href="#">Testing</a> 
     </div> 
     <div> 
     <div class="collapse navbar-collapse"> 
      <ul class="nav navbar-nav pull-right"> 
      <li><a href="#section2">Home</a></li> 
      <li><a href="#section3">Product</a></li> 
      <li><a href="#section4">Team</a></li> 
      <li><a href="#section5">Contact</a></li> 
      </ul> 
     </div> 
     </div> 
    </div> 
    </nav> 
</body>

出典

2016-07-13 Tiger

が私のコードであるよう

あなたのjQueryが多少あるべき？ – Pranjal

ちょっとPranjal、今すぐ見てください – Tiger

[Twitter Bootstrap scrollspyは常に最後の要素を選択しています]の重複している可能性があります（http://stackoverflow.com/questions/12095579/twitter-bootstrap-scrollspy-always-selecting-last-element） –

Check this working fiddle

の機能を使用してみてください。 接尾語オフセットを付けて.page-scrollスクロールする要素にクラスを追加します。（上記のフィドルに基づいて）この下に

//jQuery for page scrolling feature - requires jQuery Easing plugin 
$(function() { 

// jQuery for page scrolling feature - requires jQuery Easing plugin 
$('a.page-scroll').bind('click', function(event) { 
    var $anchor = $(this); 
    $('html, body').stop().animate({ 
     scrollTop: ($($anchor.attr('href')).offset().top - 50) 
    }, 1250, 'easeInOutExpo'); 
    event.preventDefault(); 
}); 

// Highlight the top nav as scrolling occurs 
$('body').scrollspy({ 
    target: '.navbar-fixed-top', 
    offset: 51 
}); 

// Closes the Responsive Menu on Menu Item Click 
$('.navbar-collapse ul li a:not(.dropdown-toggle)').click(function() { 
    $('.navbar-toggle:visible').click(); 
}); 

// Offset for Main Navigation 
$('#mainNav').affix({ 
    offset: { 
     top: 100 
    } 
}); 

});

出典

2016-07-13 06:06:30

Twitter Bootstrap Scrollspyは常に最後の要素を強調表示します

答えて

関連する問題