FlexSlider插件的详细设置参数

Flexslider具有以下特性:

支持滑动和淡入淡出效果。

支持水平、垂直方向滑动。

支持键盘方向键控制。

支持触控滑动。

支持图文混排,支持各种html元素。

自适应屏幕尺寸。

可控制滑动单元个数。

更多选项设置和回调函数。

HTML
在head部分载入jquery库文件和Flexslider插件,以及Flexslider所需的基本css样式文件

然后在body中加入以下HTML代码:

使用了.flexslider来包括所有需要滚动的内容元素,然后使用<ul class="slides">这个class非常关键,内部的滚动内容都是针对.slides的,然后在<li>内部加入任意  html元素,包括图片和文字。

jQuery

调用Flexslider插件非常简单,使用如下代码:

然后预览网页效果,一个内容切换效果就完成了,当然想要更多个性化设置,flexslider提供了丰富的选项配置以及回调函数绝对可以满足大多数开发者需求。

Flexslider选项设置

 

weinxin
我的微信
把最实用的经验,分享给最需要的读者,希望每一位来访的朋友都能有所收获!
avatar

Comment

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: