php走马灯如何插入图片,焦点图走马灯轮播插件(原创)

这是一个jQuery焦点图切换插件,支持自定义显示个数、滚动个数、滚播时间和间隔时间,同时具备自动滚动方向设置。只需简单配置参数,即可快速实现网站轮播、滚屏切换、单屏切换等多种焦点图效果,提高工作效率。适用于前端开发中的交互设计。
摘要由CSDN通过智能技术生成

2251e73a68e5ae5946b6f3bf660c8a57.png

3efc3516b7ecb765a1f067c294640f12.png

插件描述:网站轮播插件,支持实现轮播图,滚屏切换,单屏切换,走马灯,焦点图等等类似效果,只需要简单的配置参数调用插件即可,让工作更高效。

/*

* ***Juery焦点图切换插件***

* 作者: Xukai.json

* MIT License.

* 版本: V2.0

* 文件名: super_slider.js

* 日期: 2015-08-31

* 使用说明: 利用函数传参调用

$(".box").superSlider({//选择器必须是插件最外层盒子class或ID,包含上下按钮和轮播内容

prevBtn:  ".prevBtn",//上一页按钮

nextBtn:  ".nextBtn",//下一页按钮

listCont:  ".content",//滚动列表外层

delayTime:  1000,//自动轮播时间间隔,默认1秒

speed:  1000,//滚动速度,默认1秒/次

amount:  1,//单次滚动数量,默认1个

showNum:  4,//默认显示个数,默认4个

autoPlay:  false///是否自动自动轮播,默认否,若要自动轮播请设置成true

scrollWhere: "prev",//自动滚动方向,默然是上,下的参数为 next

});

*/

以上是JS插件里的说明,传参的class或ID和jQuery选择器一样,class用点.号,ID用井#号,建议传单个ID或class名,性能比较高

本插件支持:

1、自定义显示个数

2、自定义滚动个数

3、自定义滚播时间

4、自定义间隔时间

5、自定义自动滚动方向

6、自定义滚播

7、无缝滚动

欢迎提BUG:)

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值