flexslider是一个出色的jquery滑动切换插件,支持主流浏览器,并有淡入淡出效果。适合初级和高级网页设计师。

查询了网上资料  总结一下flexslider属性

$(function(){

$(".flexslider").flexslider({

animation:"slide"      表示滑动  还有一个"fade" 表示淡入淡出

slideshow: true        表示载入页面时,是否自动播放

slideshowSpeed :2000       表示载入自动 播放速度

animationDuration :400      淡入淡出效果延迟

slideDirection :"horizontal"    左右滑动   “vertical” 上下滑动

directionNav:true   是否显示左右控制按钮

keyboardNav:true  是否 键盘左右方向键控制图片滑动

preText:"Previous"   设置上一个按钮的文本

nextText:"Next"   设置下一个按钮的文本

常见的差不多 就是这样的

下面有几个事件

start:function(){},  开始滑动第一个的时候

before:

after:

end:

})

})

flexslider的更多相关文章

  1. 首页大图淡入淡出效果工具flexslider

    网站首页放几张高清大图轮流播放展示是目首页设计的流行做法,虽然woothemes.com已经公布了比较成熟的flexslider工具,但本着造轮子的心态,我也做了一个自己的flexslider,当然我 ...

  2. FlexSlider jQuery滑动切换插件 参数

    demo:http://www.sucaihuo.com/jquery/0/6/demo/ FlexSlider是一个非常出色的jQuery滑动切换插件,它支持所有主流浏览器,并有淡入淡出效果.适合所 ...

  3. Flexslider - 响应式的 jQuery 内容滚动插件

    FlexSlider 是一款轻量的响应式 jQuery 内容滚动插件,能够帮助你在项目轻松的创建漂亮的内容滚动效果.这款插件曾经连续多年入选 WDL 的年度最佳 jQuery 插件,值得大家在网站开发 ...

  4. flexslider.js和waypoints.js一起用时的巨坑

    Flexslider has a callback API where you can execute functions after various actions:https://github.c ...

  5. 幻灯片插件FlexSlider -- Amaze UI幻灯片参数

    用了Amaze UI 的人就知道,其幻灯片插件是 data-am-slider='{}'来传参数的:(以下代码来自Amaze UI 官网) <div data-am-widget="s ...

  6. FlexSlider插件的详细设置参数

    FlexSlider是一个非常出色的jQuery滑动切换插件,它支持所有主流浏览器,并有淡入淡出效果.适合所有初级和高级网页设计师使用.不过很多人都只是使用默认的参数,今天来说说具体的参数来给大家看看 ...

  7. FlexSlider插件的详细设置参数 http://www.woothemes.com/flexslider/ -----幻灯片插件

    $(window).load(function() { $('.flexslider').flexslider({ namespace: 'flex-', //控件的命名空间,会影响样式前缀 anim ...

  8. [原创]flexslider 中文文档 使用教程 参数手册

    要改前人用的flexslider功能,但苦于找不到详细的文档教程,折磨了好久……(所以我才说不爱乱用插件) 为了福利下之后也苦于这个问题的人,我整理总结了下我找到的一些东西.可能没那么完善正确,欢迎在 ...

  9. FlexSlider插件的详细设置参数 http://www.woothemes.com/flexslider/

    http://www.woothemes.com/flexslider/ FlexSlider插件的详细设置参数 $(window).load(function() { $('.flexslider' ...

随机推荐

  1. ViewPager With FragmentPagerAdapter

    采用PagerAdapter中的FragmentPagerAdapter来实现页面切换,适用于a handful of typically more static fragments to be pa ...

  2. Robotlegs框架1.5简介

    该框架的1.5版本位于https://github.com/robotlegs/robotlegs-framework/tree/version1,现在已经出了重新架构的2.0版本,所以我决定先研究已 ...

  3. 【Nginx】配置Nginx的负载均衡

    参考的优秀文章 tomcat配置文件server.xml详解 AJP协议总结与分析 Using nginx as HTTP load balancer 在本机运行2个Tomcat 现需要运行两个Tom ...

  4. Nordic Semiconductor nRF52832 蓝牙智能多协议单芯片解决方案荣获《中国电子商情》编辑选择奖

    挪威奥斯陆 – 2016年4月11日 – Nordic Semiconductor ASA (OSE: NOD) 赢得<中国电子商情>颁发的"2015年编辑选择奖",其 ...

  5. 单元测试:查找list[]中的最大值

     原始代码如下: int Largest(int list[], int length) { int i,max; for(i = 0; i < (length – 1); i ++ ) { i ...

  6. php : mysql数据库操作类演示

    设计目标: 1,该类一实例化,就可以自动连接上mysql数据库: 2,该类可以单独去设定要使用的连接编码(set names XXX) 3,该类可以单独去设定要使用的数据库(use XXX): 4,可 ...

  7. ★Java多线程编程总结 系列 转

    下面是Java线程系列博文的一个编目:   Java线程:概念与原理 Java线程:创建与启动 Java线程:线程栈模型与线程的变量 Java线程:线程状态的转换 Java线程:线程的同步与锁 Jav ...

  8. wamp环境下phpmyadmin拒绝访问

    You don't have permission to access /phpmyadmin on this server. 找到 alias/phpmyadmin.conf  的配置文件 将 &l ...

  9. Oracle 优化 - CPU 问题

    作为 OLTP 应用,一般不太有 CPU 问题,比较少 - 毕竟大多数问题都是 IO 引起:但是偶尔也会有. 问题判断 很简单 - OS 出现 CPU 很高的问题,持续高于 90% 应用可能会表现慢 ...

  10. hello word

    开通微博,用于记录在工作中遇到的点滴问题. 2015/08/31