html中轮换图片插件,jQuery轮播图插件

插件描述：该插件基于jquery开发，现阶段很多PC网站都需要用到轮播图切换的效果

全屏轮播图

该插件基于jquery开发，现阶段很多PC网站都需要用到轮播图切换的效果，很多时候要在页面中复用轮播图，而且对于PC用户而言，IE8+用户居多，需要做一个兼容该用户群体的全屏轮播图，同时也可以通过参数设置来把该幻灯片设置为非全屏复用多个位置。这时候该插件便应运而生。可以通过简单的调用及样式来对其进行调用，从而完成快速开发的过程。该模块并非只能是轮播图，轮播图条目区域可以放上文字列表、图片等任意内容，这块在于你自己选择。接下来对该插件进行一个

方法调用

现在对方法调用进行一个简单的解析，后面再就函数进行具体的解析。

html

这里是文本存放位置

这里是文本存放位置

js// 默认

$('.slide-box-demo').setSlide()

参数解析参数类型说明示例值

$(this)DOM当前轮播图($('.slide-box'))外层的包裹的DOM节点，可自定义标签，Dom节点操作沿袭jquery的Dom节点操作。详见demo$("#demo").setSlide()

isBlockboolean(非必填)定义幻灯片是否为块状展示该幻灯片。默认为falsetrue

fullScreenwboolean(非必填)宽度完全全屏，轮播图宽度为整个屏幕宽度。注意：当设置该参数为true时，slideLiw参数无效。默认为falsetrue

fullScreenhboolean(非必填)高度完全全屏，轮播图高度为整个屏幕高度。注意：当设置该参数为true时，slideLih参数无效。默认为falsetrue

switchingSpeednumber(非必填)定义轮播图切换速度的毫秒数。如若为空，默认自动播放时间为600毫秒800

slideTimenumber(非必填)定义轮播图自动播放的毫秒数，只有开启autoPlay属性时有效。如若为空，默认自动播放时间为3000毫秒2000

autoPlayboolean(非必填)是否自动切换，默认为falsetrue

prevElDOM(非必填)点击轮播图切换到上一张，可自定义标签，Dom节点操作沿袭jquery的Dom节点操作，默认为$('#slide-button-prev')。注意：如若使用默认标签，id只能单次调用。如果第一张操作时候便跳到最后一张。默认上一页样式：

nextElDOM(非必填)点击轮播图切换到下一张，可自定义标签，Dom节点操作沿袭jquery的Dom节点操作，默认为$('#slide-button-next')。注意：如若使用默认标签，id只能单次调用。如果最后一张操作时候便跳到第一张。默认下一页样式：

paginationboolean(非必填)是否使用分页导航，只有开启autoPlay属性时有效。默认为falsetrue

pagingTriggerstring(非必填)分页导航指示器的触发事件，默认为click'hover'

slideLiwnumber(非必填)设定轮播容器宽度，默认单位为px，无需加单位。默认为12001000

slideLihnumber(非必填)设定轮播容器高度，默认单位为px，无需加单位。默认为600500

fnObject(非必填) 回调函数，可以在当轮播图切换时，拿到当前轮播图的索引值并在该时刻进行回调的操作。与一般函数写法相同，索引值可传可不传。function(index) {} 或 function() {}

demo演示

对于上面所做的解析，如果还有不明白的话，不用担心，就上面的参数提供了demo进行解析，让你快速开发你想要的轮播图。下面为相关demo的地址：默认调用01-default

上下页切换调用02-navigation.html

分页调用03-pagination.html

自动播放04-autoplay.html

自定义宽高05-widthAndheightSetting.html

块状展示06-block-display.html

宽高完全全屏07-fullscreen.html

回调函数08-callback.html