Мне нужно пройти элементы с предыдущими и следующими кнопками.Вот HTML:
<ul>
<li><a href="#">Number 1 item</a></li>
<li><a href="#">Number 2 item</a></li>
<li><a href="#">Number 3 item</a></li>
<li><a href="#">Number 4 item</a></li>
</ul>
<input type="button" class="next" value=">" />
<input type="button" class="prev" value="<" />
JS:
(function(){
var $lis = $('ul li');
var index = 0, lastIndex = 0;
start(); // activate first, add event listeners to buttons
function next(){
lastIndex = index;
if(++index == $lis.length) index = 0; // if next is out of bounds go to first
$lis.eq(index).addClass('active');
$lis.eq(lastIndex).removeClass('active');
};
function prev(){
lastIndex = index;
if(--index < 0) index = ($lis.length - 1); // if prev is less than first to to last
$lis.eq(index).addClass('active');
$lis.eq(lastIndex).removeClass('active');
};
function start(){
$lis.eq(0).addClass('active');
$('.next').click(next);
$('.prev').click(prev);
}
})();
Этот плагин отлично работает, Вот Fiddle
Но я хочу расширить егофункциональность.Я также хочу активировать прямой щелчок на списке и запомнить его индекс.
Что я имею в виду: скажем, я дошел до пункта № 3, нажимая следующую кнопку, и если я непосредственно нажму
<li><a href="#">Number 1 item</a></li>
(элемент №: 1), то я хочу запомнить свойэта позиция в качестве текущего индекса, и когда я нажимаю на следующую кнопку, я должен перейти к элементу №2
То же самое относится и к предыдущей кнопке.
Как я могу расширить эту функцию?