У меня была проблема №1, и я нашел решение, которым хочу поделиться. Проблема с циклическими jcarousel заключается в том, что «liindex» не начинает отсчет с 1 после того, как он прошел через все доступные элементы списка, а продолжает считать вверх (как вы заметите, если добавите alert('liindex') внутри функции выделения.
Итак, если у вас есть 3 элемента списка в круговой автокарусели, как только вы закончите прокрутку в первый раз и начнете заново с элемента 1, jcarousel увидит его в 4-м элементе, а не в 1-м.
Вот мое решение (на основе этого), вычисление liindex с модульным значением общего количества элементов и текущего элемента.
var totalitems = 3; // number of total items in your carousel, you can probably detect it with jquery and replace this
function mycarousel_initCallback(carousel) {
jQuery('#external ul li a').bind('click', function() {
carousel.scroll(jQuery.jcarousel.intval(jQuery(this).text()));
return false;
});
carousel.clip.hover(function() {
carousel.stopAuto();
}, function() {
carousel.startAuto();
});
};
function highlight(carousel,objectli,liindex,listate){
actindex = teasersize - (liindex % teasersize); // calculate which item this corresponds to after first scroll
jQuery('#external a').removeAttr("class","active");
jQuery('#external a#link'+ actindex).attr("class","active");
};
function removehighlight(carousel,objectli,liindex,listate){
actindex = teasersize - (liindex % teasersize);
jQuery('#external a#link'+ actindex).removeAttr("class","active");
};
jQuery(document).ready(function() {
jQuery("#mycarousel").jcarousel({
initCallback: mycarousel_initCallback,
wrap: 'circular',
scroll: 1,
size: totalitems, // previously set in var
auto: 7,
itemVisibleInCallback: highlight,
itemVisibleOutCallback: removehighlight,
buttonNextHTML: null,
buttonPrevHTML: null
});
});
И вот как должна выглядеть ваша внешняя навигация на основе js:
<ul id="external">
<li><a href="#carouselitem1" id="link1">1</a></li>
<li><a href="#carouselitem2" id="link2">2</a></li>
<li><a href="#carouselitem3" id="link3">3</a></li> </ul>
person
rayne
schedule
25.01.2011