移动应用滑动列表 Swiped.js

MIT
JavaScript 查看源码»
跨平台
2016-03-29
开源中国股瞎

Swiped.js 提供漂亮的移动应用可滑动列表样式,采用原生JS编写。

swiped.js

功能特性:

  • 免费,无依赖包

  • 对不同程度的滑动显示不同效果

  • 支持类似QQ的滑动删除

  • 便于使用

  • 支持CSS改变样式

安装

npm install swiped  
bower install swipe

使用

直接给HTML标签添加Class即可:

<div class="foo">
    elem1
</div>

多个滑动项 :

<ul class="bar">
    <li>
        elem3
    </li>
    <li>
        elem4
    </li>
    <li>
        elem5
    </li>
</ul>

收缩 :

<div class="foo"><span></span>element 16</div>

单个初始化 :

var s1 = Swiped.init({
    query: '.foo',
    right: 300});

多个初始化 :

var s2 = Swiped.init({
    query: '.bar li',
    list: true,
    left: 200,
    right: 200});

收缩功能初始化 :

var s3 = Swiped.init({
    query: '.foo',
    left: 400
});

document.querySelector('.foo span').addEventListener('touchstart', function() {
    s3.toggle();
});

实现滑动删除

Swiped.init({
    query: '.baz',
    right: 400,
    onOpen: function() {
        this.destroy(true)
    }
});
的码云指数为
超过 的项目
加载中

评论(0)

暂无评论

暂无资讯

暂无问答

【书单】JS书单汇总:怀念2013

  从2011年11月到现在,大抵接近两年的时间。对JS的了解,不敢说有多深,不过大都得益于下列书籍。大部分看过,小部分只是翻翻。2014年打算把这些书挑一些出来回顾回顾,然后研究下新的东西...

2014/01/24 00:37
467
2
《深入理解JavaScript系列》

《深入理解JavaScript系列》系列技术文章整理收藏

2015/06/23 15:08
56
0
javascript学习资料分享

有志于web前端工作的话,javascript的知识是必不可少的。越学,我越觉得自己所欠缺的越多。路漫漫其修远兮,吾将上下而求索。下面将一些好的资料分享给大家。 JavaScript学习资料: (1)遇见...

2012/04/06 11:37
3.3K
7
解决一个html 或jsp 引入多个不同版本的jquery 解决方案

解决一个html 或jsp 引入多个不同版本的jquery 解决方案

2017/11/02 12:25
68
0
分享一些前端开发中最常用的JS代码片段

逛社区时看到的文章,我修改调整了内容,如果大家觉得也有帮助 可以收藏下~ HTML5 DOM 选择器 javascript 代码 JavaScript运行复制全屏 1 // querySelector() 返回匹配到的第一个元素 2 var ...

02/27 21:21
43
0
Impatient JavaScript 中文版校对活动期待大家的参与

贡献指南:https://github.com/apachecn/impatient-js-zh/blob/master/CONTRIBUTING.md 整体进度:https://github.com/apachecn/impatient-js-zh/issues/1 项目仓库:https://github.com/ap...

06/17 10:32
5
0
a标签中调用javascript方法的几种方法:

我们常用的在a标签中有点击事件: 1. a href="javascript:js_method();" 这是我们平台上常用的方法,但是这种方法在传递this等参数的时候很容易出问题,而且javascript:协议作为a的href属性的...

2013/12/01 00:20
64
0
asp.net中调用javascript自定义函数的方法(包括引入JavaScript文件)总结

通常javascript代码可以与HTML标签一起直接放在前端页面中,但如果JS代码多的话一方面不利于维护,另一方面也对搜索引擎不友好,因为页面因此而变得臃肿;所以一般有良好开发习惯的程序员都会...

2012/11/04 21:28
956
0

没有更多内容

加载失败,请刷新页面

返回顶部
顶部