Jquery Jcarousel带控件的多滑块选项问题
我正在使用jcarousel插件在同一页面中播放多个滑块,每个滑块都有外部控件,但按一个控件可以为所有滑块设置动画,而不是为所属控件设置动画! 代码如下:Jquery Jcarousel带控件的多滑块选项问题,jquery,jcarousel,Jquery,Jcarousel,我正在使用jcarousel插件在同一页面中播放多个滑块,每个滑块都有外部控件,但按一个控件可以为所有滑块设置动画,而不是为所属控件设置动画! 代码如下: <div id="mycarousel"> <ul> <li>item</li> <li>item</li> </ul> <div class="control">
<div id="mycarousel">
<ul>
<li>item</li>
<li>item</li>
</ul>
<div class="control">
<a href="#" class="nav_active">1</a>
<a href="#">2</a>
</div>
</div>
<div id="mycarousel_2">
<ul>
<li>item</li>
<li>item</li>
</ul>
<div class="control">
<a href="#" class="nav_active">1</a>
<a href="#">2</a>
</div>
</div>
如何使用自己的控件使每个滑块分别运行?
谢谢我也有同样的问题,对于第一个转盘,我使用了类控制,但是对于第二个转盘,我使用了类控制2。这对我很有帮助你可以用这个,它对我很有用: HTML
<div class="carousel_content">
<ul class="mycarousel">
<li>item1</li>
<li>item2</li>
<li>item3</li>
<li>item4</li>
</ul>
<div class="controls">
<a href="#" class="prev">Previous</a>
<a href="#" class="next">Next</a>
</div>
</div>
<div class="carousel_content">
<ul class="mycarousel">
<li>item1</li>
<li>item2</li>
<li>item3</li>
<li>item4</li>
</ul>
<div class="controls">
<a href="#" class="prev">Previous</a>
<a href="#" class="next">Next</a>
</div>
</div>
<div class="carousel_content">
<ul class="mycarousel">
<li>item1</li>
<li>item2</li>
<li>item3</li>
<li>item4</li>
</ul>
<div class="controls">
<a href="#" class="prev">Previous</a>
<a href="#" class="next">Next</a>
</div>
</div>
<div class="carousel_content">
<ul class="mycarousel">
<li>item1</li>
<li>item2</li>
<li>item3</li>
<li>item4</li>
</ul>
<div class="controls">
<a href="#" class="prev">Previous</a>
<a href="#" class="next">Next</a>
</div>
</div>
(function($){
$('.mycarousel').jcarousel({
scroll: 1,
animation: 1000,
easing: 'easeOutQuart',
vertical: false,
initCallback: mycarousel_initCallback,
buttonNextHTML: null,
buttonPrevHTML: null,
itemLastOutCallback: {
onAfterAnimation: disableCustomButtons
},
itemLastInCallback: {
onAfterAnimation: disableCustomButtons
}
});
function mycarousel_initCallback(carousel) {
var elementPrev = carousel.container.next('.controls').children('.prev');
var elementNext = carousel.container.next('.controls').children('.next');
elementPrev.bind('click', function() {
carousel.prev();
return false;
});
elementNext.bind('click', function() {
carousel.next();
return false;
});
};
function disableCustomButtons(carousel){
var elementPrev = carousel.container.next('.controls').children('.prev');
var elementNext = carousel.container.next('.controls').children('.next');
if (carousel.first == 1) {
elementPrev.addClass('inactive');
} else {
elementPrev.removeClass('inactive');
}
if (carousel.last == carousel.size()) {
elementNext.addClass('inactive');
} else {
elementNext.removeClass('inactive');
}
};
})(jQuery);