выделите меню при прокрутке (если достигните div)
я хочу выделить пункт меню, если div прокручивается // или щелкается.
http://jsfiddle.net/WeboGraph/vu6hN/2/ (вот пример того, что я хочу)
мой код: (JS)
$(document).ready(function(){
$('nav a').on('click', function(event) {
$(this).parent().find('a').removeClass('active_underlined');
$(this).addClass('active_underlined');
});
$(window).on('scroll', function() {
$('.target').each(function() {
if($(window).scrollTop() >= $(this).position().top) {
var id = $(this).attr('id');
$('nav a').removeClass('active_underlined');
$('nav a[href=#'+ id +']').addClass('active_underlined');
}
});
});
});
мой (html nav)
<nav>
<div id="cssmenu">
<ul id="horizontalmenu" class="underlinemenu">
<li><a data-scroll href="#fdesigns" class="active_underlined">FDesigns</a> </li>
<li><a data-scroll href="#skills">skills</a> </li>
<li><a data-scroll href="#workflow">WORKFLOW</a> </li>
<li><a data-scroll href="#portfolio">Portfolio</a> </li>
<li><a data-scroll href="#about">About</a> </li>
<li><a data-scroll href="#kontakt">Kontakt</a> </li>
</ul>
</div>
</nav>
мой (css)
.active_underlined a {
color: #fff;
border-bottom: 2px solid #ebebeb;
}
a.active_underlined {
color: #fff;
border-bottom: 2px solid #ebebeb;
}
вот ссылка на проект:http://www.f-designs.de/test_onesite