jQuery-anchorSpy.js
jQuery plugin to active menu item on scroll
Demo
##Example## HTML
<ul class="menu ease">
<li><div id="menu">menu</div></li>
<li><a href="#faq">faq</a></li>
<li><a href="#list">list</a></li>
</ul>
<div>
<a name="menu"></a>
Lorem ipsum dolor ...
</div>
...
JS
var Spy = $('.menu').anchorSpy({
margin: 50,
speed: 1000,
next: '.next',
prev: '.prev'
});
If you nead reload, then use reload()
Spy.reload();
If you nead go to the next or previous block then use next()
or prev()
method.
Spy.next();
Spy.prev();
Options
option | default | needs |
---|---|---|
margin | 50 | Integer |
speed | 1000 | Integer |
next | false | DOM selector |
prev | false | DOM selector |
active_class | 'active' | string active class name |
active_parent | true | boolean, determines which element add active class |
Для теста выполнить в репозитории npm install
и затем npm start
ToDo:
- Добавить твики плавной прокрутки
Thanks for idea, Novikov Maksim