教学之友,学习之友。

站长教学网

jQuery有过度效果的Nivo Slider焦点图代码

时间:2011-06-22 00:45来源:未知 作者:admin 点击:
jQuery有过度效果的Nivo Slider焦点图代码
jQuery有过度效果的Nivo Slider焦点图代码

功能与效果:

nivo-slider2.5.2 一个加载设置拥有16种过度效果的超级smooth slider焦点图代码,可左右翻页,有圆点导航,可添加文字说明和链接,育友网搜集整理,转载请注明出处。

兼容一下浏览器:

Internet Explorer v7+
Firefox v3+
Google Chrome v4+
Safari v4+
Opera v10+

经测试IE6流畅度不够,而且会有点击失效的情况,有能力的可以自行尝试修改。

基于原代码上改进:

1、源代码是压缩过的,解压排序后加入相关注释帮助用户学习和使用。

$.fn.nivoSlider.defaults = {
effect: 'random',//随机切换效果
slices: 15,//过度效果的数量
boxCols: 4,//垂直切割个数 数量多了会影响效率
boxRows: 4,//行切割个数
animSpeed: 2000,//动画效果切换过程使用的时间
pauseTime: 5000,//页面停留时间
startSlide: 0,//开始位置
directionNav: true,
directionNavHide: true,
controlNav: true,
controlNavThumbs: false,
controlNavThumbsFromRel: false,
controlNavThumbsSearch: '.jpg',
controlNavThumbsReplace: '_thumb.jpg',
keyboardNav: true,
pauseOnHover: true,//鼠标停留的时候停止效果切换
manualAdvance: false,
captionOpacity: 0.5,//标签透明度
prevText: 'Prev',
nextText: 'Next',
beforeChange: function() {},
afterChange: function() {},
slideshowEnd: function() {},
lastSlide: function() {},
afterLoad: function() {}
};

2、替换了下原bullets.png图片为bullets.gif,所修改的原图片还保留在压缩包内。

顶一下
(3)
100%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片