我试图使柔性滑板沿一个方向绕一个方向循环。当它到达循环中的最后一个图像然后它应该再次从第一个图像开始。
我在jsfiddle
上设置的示例有两个问题一:我无法让它在jsFiddle
上运行二:动画在最后开始然后从另一个方向开始,而我想从一个方向向左移动到右边。
$(window).load(function(){
$('.flexslider').flexslider({
animation: "slide",
animationLoop: false,
easing: "linear",
useCSS: false,
randomize: false,
pauseOnHover: true,
slideshowSpeed: 12,
animationSpeed: 8000,
controlNav: false,
directionNav: false,
itemWidth: 210,
itemMargin: 5,
start: function(slider){
$('body').removeClass('loading');
}
});
答案 0 :(得分:1)
您错过了脚本末尾的结束)};
,因此它无效,您必须在框架和扩展程序面板中将脚本部分设置为No wrap - in <head>
。
对于第一张图片,您离开了完整路径http://flexslider.woothemes.com/
可以使用animationLoop: true
设置唯一的循环功能,现在是唯一的解决方案。
这里有一个请求在github中提取,以获得更流畅的动画和循环:https://github.com/woothemes/FlexSlider/issues/287
代码:
$(window).load(function () {
$('.flexslider').flexslider({
animation: "slide",
animationLoop: true,
easing: "linear",
useCSS: false,
randomize: false,
pauseOnHover: true,
slideshowSpeed: 12,
animationSpeed: 8000,
controlNav: false,
directionNav: false,
itemWidth: 210,
itemMargin: 5,
start: function (slider) {
$('body').removeClass('loading');
}
});
});
文档:https://github.com/woothemes/FlexSlider/wiki/FlexSlider-Properties