Scrollspy Bootstrap v3.3 not working

Question

Using Bootstrap v3.3 w/ affix on navigation bar. Affix is working fine, but I cannot get the scrollspy to work at all. I created a fiddle here (removed affix from fiddle) to att

Answer 1

Here's an example of how you can do this. I would suggest using at least some pre-defined Bootstrap classes (esp for navigation links) otherwise you'll need to define all the states if you want your links to show a change to active.

 $('#nav').affix({
   offset: {
     top: $('header').height()
   }
 });

body {
  position: relative;
}
header {
  height: 125px;
  font-size: 50px;
  padding: 20px;
  text-align: center;
}
div#nav.affix {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 10;
}
.navbar.navbar-custom {
  margin-bottom: 0;
}
#section1 {
  padding-top: 50px;
  height: 500px;
  color: #fff;
  background-color: #1E88E5;
}
#section2 {
  padding-top: 50px;
  height: 500px;
  color: #fff;
  background-color: #673ab7;
}
#section3 {
  padding-top: 50px;
  height: 500px;
  color: #fff;
  background-color: #ff9800;
}
#section41 {
  padding-top: 50px;
  height: 500px;
  color: #fff;
  background-color: #00bcd4;
}
#section42 {
  padding-top: 50px;
  height: 500px;
  color: #fff;
  background-color: #009688;
}

  
Header Area
  

    

      

        

           
            
             
           Brand

        
        

          

            

              
Section 1

              
              
Section 2

              
              
Section 3

              
              
Section 4 

                

                  
Section 4-1

                  
                  
Section 4-2

                  
                
              
            
          
        
      
    
  
  

    
Section 1

    
Try to scroll this section and look at the navigation bar while scrolling! Try to scroll this section and look at the navigation bar while scrolling!
    
Try to scroll this section and look at the navigation bar while scrolling! Try to scroll this section and look at the navigation bar while scrolling!
  
  

    
Section 2

    
Try to scroll this section and look at the navigation bar while scrolling! Try to scroll this section and look at the navigation bar while scrolling!
    
Try to scroll this section and look at the navigation bar while scrolling! Try to scroll this section and look at the navigation bar while scrolling!
  
  

    
Section 3

    
Try to scroll this section and look at the navigation bar while scrolling! Try to scroll this section and look at the navigation bar while scrolling!
    
Try to scroll this section and look at the navigation bar while scrolling! Try to scroll this section and look at the navigation bar while scrolling!
  
  

    
Section 4 Submenu 1

    
Try to scroll this section and look at the navigation bar while scrolling! Try to scroll this section and look at the navigation bar while scrolling!
    
Try to scroll this section and look at the navigation bar while scrolling! Try to scroll this section and look at the navigation bar while scrolling!
  
  

    
Section 4 Submenu 2

    
Try to scroll this section and look at the navigation bar while scrolling! Try to scroll this section and look at the navigation bar while scrolling!
    
Try to scroll this section and look at the navigation bar while scrolling! Try to scroll this section and look at the navigation bar while scrolling!