基于Jquery的banner轮播插件,简单粗暴

新手练习封装插件,觉着在前端这一块的轮播比较多,各种旋转木马一类的3D旋转,技术不够,所以封装了一个简单的banner轮播插件,功能也比较简单,就是左右向的轮播。

先挂地址https://github.com/DEATHBUG/banner_tool

第一个放进去的项目,相当有纪念意义,大神轻虐。

下面放传参参数

$(".banner").Banner({
child:'li',    //包含图片的父级标签,默认li
time:'3000',    //轮播间隔时间
direction:"right",    //轮播方向,目前仅支持left和right
choose:'false',    //是否支持触摸小点的轮播触摸事件,默认false。
chooseId:'id',    //小点外部父级标签ID。仅限choose开关打开。
chooseActive:'red',    //支持小点的选中状态classname。仅限choose开关打开。
preId:'pre',    //向前翻页的按钮id
nextId:'next'    //向后翻页的按钮id
});

 

  

目前仅支持控制轮播的时间间隔,轮播方向为左右,
choose为前面触点标记,若为true则为打开,需加载如下触点父级标签ID,以及用户点击的样式变化class;
如果添加前后翻页按钮,则添加参数前后翻页的按钮ID;

<div id="dian">
<span></span>
<span></span>
<span></span>
<span></span>
</div>

  若添加触摸选页标记,传递ID即可;

 

我是个web程序猿,享受代码,乐于前端,正在摸索前进的道路上。

如果发现有什么问题,希望能在下面评论或者及时反馈给qq 2109796331,非常感激您的上帝视角。请不吝赐教!!

转载于:https://www.cnblogs.com/qj0813/p/5474182.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值