Question

我想基于DIV制作一个“coverflow效果”。我决定使用bxslider，一切正常，但我没有得到中心＆＃34;缩放效果＆＃34;我想要...你可以看到我想要的例子。http://www.cssjquery.com/coverflow.php

我不确定如何在bxslider上获得此效果。如果我在每个中心LI上添加额外的课程，是否可以？意思是，无论哪个＆＃34; li＆＃34;正在移动到中心，我可以添加一个类＆＃34;活跃＆＃34; ...所以我可以进行主动转换：sceal等。

您对我如何实现这一目标有什么想法吗？或者您可以为此推荐的任何其他封面流程脚本....

感谢。

演示

http://jsfiddle.net/cyber007/cbzmopzb/

Answer 1

使用内置API，如onSlideBefore，bxSlider中的onSliderLoad，可以实现动画。

jQuery(function($){

var slider = $('.bxslider').bxSlider({
 minSlides: 1,
  moveSlides:1,
  maxSlides: 3,
   pager:false,
  controls:false,
  slideWidth: 360,
  slideMargin: 0,
    onSlideBefore : function($slideElement, oldIndex, newIndex){ // your code here 

$(".bxslider li").removeClass("active-slide")
        $slideElement.next().addClass("active-slide")
},
    onSliderLoad:function(index){

$(".bxslider li").eq(1+$(".bxslider .bx-clone").length/2).addClass("active-slide")
    }
});

演示：http://jsfiddle.net/dao1kkfo/2/

如何在中心li上添加活动类

1 个答案: