0

I have a single page with multiple sections. I also have a fixed header bar. When I scroll to each section, I want the section title to display inside the fixed header bar.

I tried this:

$('a.icons').click(function(){
    $('html, body').animate({scrollTop: $('section.icons').offset().top - 100}, 300);

    $icon = $('.style-menu-icon');

    $icon.text(function () {
        //change text based on condition
        return "Icons";
    });

  });

This is saying or at least is trying to say: Click on link icons.
Scroll to section.icons div, offset -100px
return the string "Icons" inside the .style-menu-icon div class

AnMaree
  • 1,771
  • 2
  • 12
  • 11
  • 1
    What is the question/problem? – Ram May 04 '15 at 04:07
  • How do I display the sections title inside of a div when scrolled to that particular section? – AnMaree May 04 '15 at 04:16
  • You can use bootstrap nav for it. Refer: http://startbootstrap.com/template-overviews/agency/ – Sai Deepak May 04 '15 at 04:33
  • Does this mean the `text` method fails to do that? Listening to `scroll` event is recommended as when the user scrolls the page manually the text is not updated. – Ram May 04 '15 at 04:34
  • @SaiDeepak Bootstrap is _expensive_ for this. – Ram May 04 '15 at 04:35
  • The script I posted actually works, but it just displays the title on click, how can I display the title on scroll, and for multiple sections? Will I have make an individual script for each section or can I grab the .text from the section title div within each section? – AnMaree May 04 '15 at 04:44
  • You can listen to `scroll` event of the `window` object and filter the matching section. In fact your `click` handler shouldn't change the text. One `scroll` handler is sufficient. You are also hard-coding the click handlers which is not recommended, think more dynamic and DRY! – Ram May 04 '15 at 04:50
  • Its free of cost just check it – Sai Deepak May 04 '15 at 06:14
  • @SaiDeepak Expensive performance-wise, I know it's free! :) A sane developer doesn't load a framework for using just one of it's features! – Ram May 04 '15 at 10:08
  • in order to "filter the matching section" do I need to use a for loop? – AnMaree May 04 '15 at 13:02
  • Yes, something like that. Please check this somehow related question. http://stackoverflow.com/questions/9979827/change-active-menu-item-on-page-scroll – Ram May 04 '15 at 19:59

0 Answers0