最新文章
    
    本栏相关
    其他文章
        
        
        
   
    
    
  ☑下载/引用地址: ☞ http://www.xcsoft.cn/Public/js/jquery.imgscroll.min.js☜
☑基本调用方法,其他可参考演示
// JavaScript Document
/**
 * 当你的页面已经加载jquery时,如下写法
 */
$(function(){
    imgScroll.scroll({
        name:'imgscroll2',
        width:'380px',
        direction:"left",
        height:'180px',
        addcss:true,
        showinfo:"scroll",
        infodirection:'top',
        speed:200
    },5000,1000)
})
/**
 * 当你的页面还没有加载jquery时,本函数自动加载jquery,默认调用百度CDN公共库的jquery
 * xcsoft.jquery(function(){...},param)
 * @param function(){...} 函数,即jquery加载后执行,如同$(function(){...})
 * @param param string 版定本[见下方取值]或者自义jquery相对路径或者绝对路径,默认调用百度CDN公共库的jquery中的1.6.4版本
 * version 取值规定:2.0.3, 2.0.2, 2.0.1, 2.0.0, 1.10.2, 1.10.1, 1.10.0, 1.9.1, 1.9.0, 1.8.3, 1.8.2, 1.8.1, 1.8.0, 1.7.2, 1.7.1, 1.7.0, 1.6.4, 1.6.3, 1.6.2, 1.6.1, 1.6.0, 1.5.2, 1.5.1, 1.5.0, 1.4.4, 1.4.3, 1.4.2, 1.4.1, 1.4.0, 1.3.2, 1.3.1, 1.3.0, 1.2.6, 1.2.3
 * xcsoft.jquery(function(){},'1.6.4')//调用百度CDN公共库中的jquery版本
 * xcsoft.jquery(function(){},'http://www.xcsoft.cn/Public/js/jquery.js')//调用自定义jquery
 */
xcsoft.jquery(function(e){
    //滚动循环示例
    imgScroll.scroll({
        name:'imgscroll2',
        width:'380px',
        direction:"left",
        height:'180px',
        addcss:true,
        showinfo:"scroll",
        infodirection:'top',
        speed:200
        },5000,1000)
});✍ 焦点渐变循环切换:imgScroll.gradual({参数:值,参数:值,...},图片停留时间,动画切换速度) ☞ 查看演示
| 参数 | 值 | 有效性 | 描述 | 
| name | 自定义 | 必填 | 图片切换容器的class样式名,如:imgscroll | 
| event | click|hover | 选填 | 焦点控制的鼠标事件,默认:hover | 
| addcss | true|false | 选填 | 自动添加必要CSS样式,默认:true | 
| autoplay | true|false | 选填 | 自动滚动,默认:true | 
| width | 自定义 | 选填:addcss为true时生效 | 循环的元素宽度,如:380px,默认:取第一个li的宽度 | 
| height | 自定义 | 选填:addcss为true时生效 | 循环的元素高度,如:180px,默认:取第一个li的高度 | 
| prev | 自定义 | 选填 | 控制上一张显示的class样式名,默认:pre | 
| next | 自定义 | 选填 | 控制下一张显示的class样式名,默认:next | 
| showinfo | gradual|scroll|normal | 选填 | 图片说明的显示方式,gradual(渐变/默认)、scroll(滚动) | 
| infodirection | bottom|left|right|top | 选填:showinfo为scroll时生效 | 图片说明的滚动方向,默认:bottom | 
| speed | 自定义 | 选填:showinfo不为normal时生效 | 图片说明的滚动速度,默认:100(0.1s) | 
✍ 焦点滚动循环切换:imgScroll.scroll({参数:值,参数:值,...},图片停留时间,动画切换速度) ☞ 查看演示
| 参数 | 值 | 有效性 | 描述 | 
| name | 自定义 | 必填 | 图片切换容器的class样式名,如:imgscroll | 
| direction | left|right|top|bottom | 选填 | 定义滚动方向,默认:left | 
| event | click|hover | 选填 | 焦点控制的鼠标事件,默认:hover | 
| addcss | true|false | 选填 | 自动添加必要CSS样式,默认:true | 
| autoplay | true|false | 选填 | 自动滚动,默认:true | 
| width | 自定义 | 选填:addcss为true时生效 | 循环的元素宽度,如:380px,默认:取第一个li的宽度 | 
| height | 自定义 | 选填:addcss为true时生效 | 循环的元素高度,如:180px,默认:取第一个li的高度 | 
| prev | 自定义 | 选填 | 控制上一张显示的class样式名,默认:pre | 
| next | 自定义 | 选填 | 控制下一张显示的class样式名,默认:next | 
| showinfo | gradual|scroll|normal | 选填 | 图片说明的显示方式,gradual(渐变/默认)、scroll(滚动) | 
| infodirection | bottom|left|right|top | 选填:showinfo为scroll时生效 | 图片说明的滚动方向,默认:bottom | 
| speed | 自定义 | 选填:showinfo不为normal时生效 | 图片说明的滚动速度,默认:100(0.1s) | 
✍ 连续无缝循环滚动:imgScroll.rolling({参数:值,参数:值,...}) ☞ 查看演示
| 参数 | 值 | 有效性 | 描述 | 
| name | 自定义 | 必填 | 图片滚动容器的class样式名,如:imgscroll | 
| direction | left|right|top|bottom | 选填 | 定义滚动方向,默认:left | 
| addcss | true|false | 选填 | 自动添加必要CSS样式,默认:true | 
| width | 自定义 | 选填:addcss为true时生效 | 循环的元素宽度,如:380px | 
| height | 自定义 | 选填:addcss为true时生效 | 循环的元素高度,如:180px | 
| speed | 自定义 | 选填 | 滚动速度,默认:40(数值越小,滚动越快) | 
        注1:当addcss为false时,将不添加必要的CSS样式,请在CSS里自行添加.
注2:如需渐变/滚动实时切换看效果时,请将addcss改为true.
注3:[必须]使用前需引用JQuery,或者使用xcsoft.jquery自动加载JQuery.
按键盘左右方向键可快速浏览上一篇(←)、下一篇(→)
| 您的姓名: | |
| 上一步:鼠标向上滚动/左方向键(←) 下一步或完成:鼠标向下滚动/Tab键/右方向键(→) | 
| 您的电话: | |
| 您的邮箱: | 
| 信息内容: | |
| 验证码: |