基于Swiper4 实现的页面拖拽左右滑动效果

所属分类:输入,媒体-拖和放,Tabs

 34411  317  查看评论 (9)
分享到微信朋友圈
X
基于Swiper4 实现的页面拖拽左右滑动效果 ie兼容11

更新时间:2018/12/18 下午5:12:44

更新说明:添加了监听事件:

xsw_swiper({
    index: 0, //默认为0
    data: function(index) { //监听事件
        console.log(index) //监听到的index
    }
})
<div> class='qiHuan' data-index='0'  data-xunClass='xuan'>第一</div>
  • data-index:当前table链接到第几个

  • data-xunClass:当前页的样式

  • <div  data-activeIndex='0'>:data-activeIndex:当前页数的index

相关插件-拖和放,Tabs

jQuery双击拖拽图片

jQuery鼠标双击事件拖拽图片
  拖和放
 30342  298

jQuery拖拽拖放插件DAD

DAD 是一款基于 jQuery 的拖拽拖放插件,它支持常见的水平拖放、垂直拖放、多行拖放、指定拖放区域、回调函数、允许禁止拖放等等,同时你也可以稍加改造,做成类似垃圾篓、购物车等效果。
  拖和放
 80708  653

jquery div拖拽换位合并拆分(原创)

拖动div块,两个div距离足够近时合并,远一点时换位。右键点击已合并的div,可显示可选择拆分数组,点击要拆分的数据,即可拆分。再次右击已合并的div即可收起可选择的拆分数据组
  拖和放
 21240  228

jQuery移动端手势滑动切换(原创)

仿探探应用首页,原生图片切换(个人原创)移动端
  拖和放
 31737  334

讨论这个项目(9)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    。花开在静默的半夏 0
    2021/1/26 10:20:52
    彭宏丁 0
    2021/1/21 10:39:16
    插件使用后 若插件里是iframe的话不会出现轻轻一点就翻页的情况 但是 若是平常的html代码 就会出现 你鼠标不小心轻轻一点 也许是向左也许是向右滑动了一点点(几PX) 插件就直接翻页了 求带佬解 回复
    彭宏丁 0
    2020/11/23 17:54:11
    萌新想问一下为什么放到ul里就失效了 回复
    ゆBlUeS.㈨ 0
    2019/1/24 12:12:29
    Uncaught TypeError: Cannot read property 'length' of undefined
    at h.slideTo (swiper.min.js:12)
    at xsw_js.js:45
    为什么出现这种情况 回复
    guo一号 0
    2018/12/20 20:45:10
    _依涵_ 0
    2018/12/18 19:01:03
    我不会唱丁香花 0
    2018/12/18 16:56:22
    打小村里人就说我帅 0
    2018/12/18 11:01:52
    可不可以多兼容ie
    回复
    ... 0
    2018/12/14 16:43:48
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复