我试图从几个小时开始执行此操作,但是无法执行。
我试图始终将中间幻灯片设置为活动幻灯片,但似乎它在上下移动。
这是代码:
的HTML
<div class="slider8">
<div class="slide"><a href="#">Sell My</a></div>
<div class="slide"><a href="#">Fix My</a></div>
<div class="slide"><a href="#">Buy A</a></div>
</div>
JS
var slider = $('.slider8').bxSlider({
mode: 'vertical',
slideWidth: 300,
minSlides: 3,
moveSlides: 1,
slideMargin: 10,
onSlideAfter: function (currentSlideNumber, totalSlideQty, currentSlideHtmlObject) {
console.log(currentSlideHtmlObject);
$('.active-slide').removeClass('active-slide');
$('.slider8>div:not(.bx-clone)').eq(currentSlideHtmlObject + 1).addClass('active-slide')
},
onSliderLoad: function () {
$('.slider8>div:not(.bx-clone)').eq(1).addClass('active-slide')
}
有人可以帮忙吗?
谢谢。
这是一个棘手的问题……至少对我而言。在尝试了许多不同的东西并阅读了BxSlider文档之后,我终于开始使用它了。
这是我可以使用的代码:
var slider = $('.slider8').bxSlider({
mode: 'vertical',
slideWidth: 300,
minSlides: 3,
moveSlides: 1,
slideMargin: 10,
onSliderLoad: function () {
$('.slider8>div:not(.bx-clone)').eq(1).addClass('active-slide');
},
onSlideAfter: function ($slideElement, oldIndex, newIndex) {
$('.slide').removeClass('active-slide');
$($slideElement).next().addClass('active-slide');
}
});
这是您的提琴的修改版本,其中包含工作版本:http : //jsfiddle.net/LU5vA/22/。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句