javascript - Automatically Highlight Navigation Links on Horizontal Free Scrolling Website -


i have particular page set of images contained in white-space:nowrap div, page scrolls horizontally. there's fixed (main) navigation menu on left.

i have second navigation set, underneath images, when click on various links uses scrollto scroll browser relevant image. second navigation menu contained in fixed div , made of series of links various anchors associated images.

i way of attaching , removing active class these links (i.e. addclass() ) depending on browser window (and in view).

i have found lots of vertical versions of this, js knowledge isn't fantastic , haven't been able convert these used horizontally.

essentially horizontal version of jsfiddle.

i have come across plugin, haven't managed work me either: here

thank you!

this fiddle horizontal:

http://jsfiddle.net/x3v6y/

i made little change on html, , here js:

$(function(){     var sections = {},         _width  = $(window).width(),                = 0;      // grab positions of our sections      $('.section').each(function(){         sections[this.name] = $(this).offset().left;     });      $(document).scroll(function(){         var $this = $(this),             pos   = $this.scrollleft();          for(i in sections){             if(sections[i] >= pos && sections[i] <= pos + _width){                 $('a').removeclass('active');                 $('#nav_' + i).addclass('active');             }           }     }); }); 

Comments

Popular posts from this blog

basic authentication with http post params android -

vb.net - Virtual Keyboard commands -

css - Firefox for ubuntu renders wrong colors -