jQuery - Menu Scroll Item Effect Example - What is it called?

Does anyone know what the jQuery effect on this page is called? http://crushlovely.com/

As you scroll down the page, a different left menu item selects based on your scroll location.

I need开发者_StackOverflow中文版 to know what the effect is called or how to re-create it?

I believe your looking for a tutorial along the lines of this

http://www.distractedbysquirrels.com/blog/one-page-layout-with-fixed-navigation-and-jquery/

I would call it a 'fixed menu/nav', or sometimes people call it a 'sticky menu/nav'. Its done pretty easily by using the position:fixed CSS and working on from there.

Hope that helps

You can do something like this:

get the position of the scrollbar and if that distance is bigger then the div top distance you add the class activated

like back to top buttons, something like that:

$(window).scroll(function () {
  if ($(window).scrollTop() > element1_top_distance) {
    element1.addClass('active');
  } else if ($(window).scrollTop() > element2_top_distance) {
    element2.addClass('active');
  } else if ($(window).scrollTop() > element3_top_distance) {
    element3.addClass('active');
  } else if ($(window).scrollTop() > element4_top_distance) {
    element4.addClass('active');
  }
});

with that you can create that layout pretty easy, just remember to correct this code for javascript or jQuery and you'l be fine