Mobiscroll是一个用于触摸设备的日期和时间选择器,它的使用不会改变HTML5、PhoneGap以及混合应用的原生用户体验。作为一款jQuery滑动选择插件,用户可以自定义主题样式,为自己的移动项目UI组件添色。Mobiscroll支持所有主流平台:iOS、Android、BlackBerry, Windows Phone 8以及Amazon Kindle。

它具有如下优点:
1.触摸式UI界面
    在智能手机和平板的移动设备上,使用大量的手势和触摸与mobiscroll进行互动。
2.主题化
    完全的主体化。有各种各样的主题,但是要经过简单的额外定制以匹配设备中使用的主题。
3.整合插件
    在最受欢迎的MVVM框架和平台中整合诸如Angular.JS, Knockout, Backbone, Bootstrap, Kendo UI等UI插件。
4.跨平台
    真正的跨平台和跨浏览器。可以在主流的移动和桌面浏览器上工作。支持iOS, Android, Windows Phone 8, Windows8, Blackberry, Amazon Kindle等平台。
5.支持多种框架
    不管是使用jQuery, jQuery Mobile, Zepto.JS还是Intel App Framework,Mobiscroll都为上述四种框架提供完美支持。
6.用户体验
    所有的组件设计都密切关注用户体验和性能。高级控件不会让用户感到失望。

官网地址:http://www.mobiscroll.com/

在线例子:http://demo.mobiscroll.com/

下载地址:http://download.mobiscroll.com/

GIT托管地址:https://github.com/acidb/mobiscroll

最新2.17.0破解版下载:http://download.csdn.net/detail/shimiso/9260795

文档API 地址:http://docs.mobiscroll.com/

代码示例:

  1. $(function () {
  2. $('#demo').mobiscroll().treelist({
  3. theme: 'mobiscroll',//样式
  4. display: 'bottom',//指定显示模式
  5. fixedWidth: [160,160,160],//三组滚动框的宽度
  6. placeholder: '请选择...',//空白等待提示
  7. lang: 'zh', //语言
  8. mode:'scroller',//选择模式  scroller  clickpick  mixed
  9. rtl:false,//按钮是否靠右
  10. headerText:'',//头部提示文字
  11. rows:5,//滚动区域内的行数
  12. //  defaultValue: ['', '', ''],//设置初始值
  13. labels: ['省', '市', '区'],
  14. showLabel:true,//是否显示labels
  15. closeOnOverlay:false,//如果为ture覆盖点击将滚动条内数据将关闭遮罩层
  16. tap:true,
  17. onSelect: function (valueText, inst) {
  18. var val = inst.getVal(); // Call the getVal method
  19. var value = inst.getValue(); //
  20. var arryVal = inst.getArrayVal();
  21. //alert(valueText);
  22. },
  23. formatResult: function (data) {
  24. return data[0] + '_' + data[1]+ '_'+ data[2];
  25. }
  26. });
  27. });

也可以自定义样式

Mobiscroll的介绍【一款兼容PC和移动设备的滑动插件】的更多相关文章

  1. 一款兼容pc 移动端的tab切换

    利用touchslider.js插件来制作的tab切换,可任意修改很方便~~~ 样式: <style> .box-163css{ width:100%; position:relative ...

  2. 一款多功能的移动端滚动选择器,支持单选到多选、支持多级级联、提供自定义回调函数、提供update函数二次渲染、重定位函数、兼容pc端拖拽等等..

    https://github.com/onlyhom/mobileSelect.js/blob/master/docs/README-CN.md mobileSelect.js 一款多功能的移动端滚动 ...

  3. 利用React Native 从0到1 开发一款兼容IOS和android的APP(仿造京东)

    最近有一部电视剧叫做<微微一笑很傻逼>里面有个男猪脚,人们都叫他大神~我觉得吧~大神是相对的~所以~啥事都得谦虚! 好了 今天介绍的是如何从0到1利用React Native开发一款兼容I ...

  4. 介绍一款小众的IDE

    作为前端工程师的你们平时主要使用什么IDE,atom.webstorm.sublime还是vscode? 今天介绍一款比较小众的IDE,Adobe的开源项目Brackets,提供Windows和OS ...

  5. 介绍一款“对话框”组件之 “artDialog”在项目中的使用

    在实际开发项目中经常会用到对话框组件,提示一些信息.其实有很多,例如:在项目中常用到的“Jquery-UI.Jquery-EasyUI”的.Dialog,他们也很强大,Api文档也很多.今天就介绍一款 ...

  6. 一个 VUE 组件:实现子元素 scroll 父元素容器不跟随滚动(兼容PC、移动端)

    介绍 我们经常遇到一种情况.当滑动滚动条区域时,子元素滚动条到底部或顶部时就会触发父级滚动条,父级滚动条同理会继续向上触发,直至body容器.这是浏览器默认的滚动行为. 但是很多情况,我们想要子元素滚 ...

  7. Linux下介绍一款不错的HTML编辑器

    编写HTML文档需要编辑器,在windows平台上我们可以用NotePad++,下面介绍一款Linux下的编辑器Komodo Edit,这是一款免费,开源的编辑器. 他对HTML的支持有其独到之处,我 ...

  8. 手把手教你做一个原生js拖动滑块【兼容PC和移动端】

    废话少说: 在PC端可以用mousedown来触发一个滑块滑动的效果,但在手机上,貌似无法识别这个事件,但手机上有touchstart事件,可以通过一系列"touch"事件来替代P ...

  9. 《介绍一款开源的类Excel电子表格软件》续:七牛云存储实战(C#)

    两个月前的发布的博客<介绍一款开源的类Excel电子表格软件>引起了热议:在博客园有近2000个View.超过20个评论. 同时有热心读者电话咨询如何能够在SpreadDesing中实现存 ...

随机推荐

  1. Nginx的知识分享,感兴趣的可以看一下

    我干了五年了,我想把我的经验跟大家分享一下,欢迎大家阅读. 1. Nginx入门简介 WEB服务器也称为WWW(WORLD WIDE WEB)服务器,主要功能是提供网上信息浏览服务. WWW 是 In ...

  2. Python学习之--socket续集

    IO多路复用: I/O多路复用指:通过一种机制,可以监视多个描述符,一旦某个描述符就绪(一般是读就绪或者写就绪),能够通知程序进行相应的读写操作. 一个很简单的linux例子,select,poll, ...

  3. windows10 使用gitblit搭建git服务器

    今天在win10上使用gitblit搭建git服务器时被坑了下,因为安装的java9出现不兼容问题,果断卸载重装了jdk8.废话不多说直接进入正题吧: 第一章 前言 使用gitblit搭建git se ...

  4. 》》jquery-weui 初

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta na ...

  5. [Contiki系列论文之1]Contiki——为微传感器网络而生的轻量级的、灵活的操作系统

    说明:本系列文章翻译自Contiki之父Adam Dunkels经典论文,版权归原作者全部. Contiki是由Adam Dunkels及其团队开发的系统,研读其论文是对深入理解Contiki系统的最 ...

  6. Java 并发专题 : Executor具体介绍 打造基于Executor的Webserver

    转载标明出处:http://blog.csdn.net/lmj623565791/article/details/26938985 继续并发,貌似并发的文章非常少有人看啊~哈~ 今天准备具体介绍jav ...

  7. leetcode第一刷_Populating Next Right Pointers in Each Node II

    很自然的推广,假设去掉全然二叉树的条件呢?由于这个条件不是关键,因此不会影响整体的思路.做法依旧是每次找到一层的起点,然后一层一层的走. 假设是全然二叉树的话,每层的起点就是上一层起点的左孩子,兄弟之 ...

  8. 自学Python4.2 迭代器、生成器

    迭代器.生成器一.迭代器 迭代器是访问集合元素的一种方式.迭代器对象从集合的第一个元素开始访问,直到所有的元素被访问完结束.迭代器只能往前不会后退,不过这也没什么, 因为人们很少在迭代途中往后退.另外 ...

  9. order by按照指定记录排序

    //按照id降序 并把name是小黑的排在最后SELECT * from dms_student order by name not like '小黑' desc,id desc; //按照id降序 ...

  10. rabbitmq配置镜像模式

    学习是spring cloud的时候用到了rabbitmq,在实际项目中也用到了,镜像模式是集群的基础上面配置的,就多了一个数据同步,rabbitmq存储消息用的是cookie,配置之前先同步cook ...