Пожалуйста помогите с простым скриптом.
Мой скрипт. при клике на NEXT добавляет активный класс следующему элементу. Нужно дополнить: Если элемент последный, добавить class = «active» Первому.
HTML: <ul class=«pagination»> <li class=«active»><a class=«one» href="#">X</a></li> <li><a class=«two» href="#">X</a></li> <li><a class=«three» href="#">X</a></li> </ul> <a href="" class=«next»>Next</a> <a href="" class=«prev»>Prev</a> JS: $('.next').click(function(){ $('ul.pagination').find('li.active').removeClass(' active').next().addClass('active'); return false; }); CSS: .active a {background:red;} |
var items = $('ul.pagination').children(); var index = 0; $('.next, .prev').click(function(e){ items.eq(index).removeClass('active'); if (this.className == 'next') index = (index == items.length-1) ? 0 : ++index; else index = (index == 0) ? items.length-1 : --index; items.eq(index).addClass('active'); e.preventDefault(); }); |
m.koloskov,
Вариант... <!DOCTYPE HTML> <html> <head> <title></title> <style type="text/css"> .active a {background:red;} </style> <meta charset="utf-8" /> <script src="http://code.jquery.com/jquery-latest.js"></script> <script> $(function(){ $('.next').click(function(){ var next = $('ul.pagination').find('li.active').removeClass('active').next() next.index() < 0 &&(next = $("ul.pagination li:first")); next.addClass('active'); return false; }); $('.prev').click(function(){ var prev = $('ul.pagination').find('li.active').removeClass('active').prev() prev.index() < 0 &&(prev = $("ul.pagination li:last")); prev.addClass('active'); return false; }); }); </script> </head> <body> <ul class="pagination"> <li class="active"><a class="one" href="#">X</a></li> <li><a class="two" href="#">X</a></li> <li><a class="three" href="#">X</a></li> </ul> <a href="" class="next">Next</a> <a href="" class="prev">Prev</a> </body> </html> |
jquery портит людей )
jquery заставляет делать все через dom-манипуляцию и перемещение по dom-у. Цепочки заставляют отказываться от "кэширования" в переменные. |
Часовой пояс GMT +3, время: 09:31. |