轮播插件
来源:互联网 发布:php小偷程序破解 编辑:程序博客网 时间:2024/06/01 08:57
转自用户zhuxiandan
现在市面上基于jQuery的轮播图插件种类繁多,各具特色,这对于具有选择困难症的童鞋来说就痛苦了,不知道选哪个,那么,今天小编就来帮你选择一款,号称最好的jquery幻灯片插件,Nivo-Slider,这款插件无论是在交互效果,还是轮播效果,还是使用方法及功能都堪称完美。其效果可与Flash的幻灯片媲美,例如: 这个flash的幻灯显示
主要特性:
- 号称世界最棒的jQuery幻灯插件
- 16种幻灯变化的特效
- 简单并且配置灵活
- 体积小并且符合语义
- jQuery插件使用免费(但是wordpress插件需要付费:20美元)
1.引入以下js文件和CSS文件
标注:我测试了以下,该插件目前只支持1.4.3版本的JQuery库,用其他的库的话可能会出现异常(亲测有效)2.在head标签中加入以下js代码
标注:该插件提供的方法中提供了诸多参数,供用户自由选择使用,视具体情况3.在body中加入以下格式的html代码
此外,你还可以自定义一些选项参数:
- effect: 设置幻灯变化效果,可以使用'random', 或者指定效果如, 'fold,fade,sliceDown'
- slices: slice动画效果参数
- boxCols: box动画效果参数
- boxRows:box动画效果参数
- animSpeed: 动画变化速度
- pauseTime: 每个幻灯时间
- startSlide: 起始幻灯
- directionNav: 是否显示“上一个”和“下一个”导航
- directionNavHide: 是否悬浮显示导航
- controlNav: 是否显示导航控制
- controlNavThumbs: 导航是否使用缩略图
- controlNavThumbsFromRel: 是否让图片使用rel
- controlNavThumbsSearch: 导航缩略图后缀
- controlNavThumbsReplace: 导航缩略图替换
- keyboardNav: 是否键盘导航
- pauseOnHover: 悬浮是否停止
- manualAdvance: 是否手动变化幻灯
- captionOpacity: 标题透明度
- prevText: 上一张文字设定
- nextText: 下一张文字设定
- randomStart: 是否随机开始
- beforeChange: 函数,在幻灯变化前调用
- afterChange:函数,在幻灯变化后调用
- slideshowEnd:函数,在幻灯变化完成调用
- lastSlide:函数,在最后一个幻灯变化完成调用
- afterLoad: 函数,slider加载后调用
effect属性有十六种效果,默认为random(随机切换效果):
- random
- sliceDown
- sliceDownLeft
- sliceUp
- sliceUpLeft
- sliceUpDown
- sliceUpDownLeft
- fold
- fade
- slideInRight
- slideInLeft
- boxRandom
- boxRain
- boxRainReverse
- boxRainGrow
- boxRainGrowReverse
如果你想为每一张图片自定义轮播效果:
最后附上下载链接:http://pan.baidu.com/s/1pLTxhqj 提取密码:nsmf
阅读全文
0 0
- 图片轮播插件
- 图片轮播插件
- bootstrape 轮播插件
- BootStrap 轮播插件
- 封装轮播插件
- jquery轮播插件
- Bootstrap轮播插件
- bootstrap轮播插件
- 轮播插件
- jQuery 图片轮播插件
- jQuery 图片轮播插件
- 简单图片轮播插件
- 推荐轮播插件--touchSlidertouchSlider
- JQuery图片轮播插件
- swiper图片轮播插件
- js 图片轮播插件
- jq编写轮播插件
- slidesjs轮播插件使用方法
- 23种设计模式(1)-单例模式
- Python的两种主要实现
- JS开发中的一些小技巧和方法
- WPF利用委托与事件实现VM对View中控件的调用
- caffe编译
- 轮播插件
- go编程:浅析go程序初始化顺序
- 数据降维、PCA——基于鸢尾花数据集
- Nginx相关配置简单说明
- Linux发行版安装软件选择:编译、软件包or容器?
- 单例类
- 如何免费获取windows10开发者账户(个人)
- 简单的makefile例子
- 微信公众号开发--服务器配置(傻瓜入门教程)