什么是插件 移动端要求的是快速开发,所以我们经常会借助于一些插件来帮我完成操作,那么什么是插件呢? JS 插件是 js 文件,它遵循一定规范编写,方便程序展示效果,拥有特定功能且方便调用。...插件的使用 引入 js 插件文件。 按照规定语法使用。 fastclick 插件解决 300ms 延迟。...其他移动端常见插件 lsuperslide: http://www.superslide2.com/ l iscroll: https://github.com/cubiq/iscroll 5....移动端视频插件 zy.media.js H5 给我们提供了 video 标签,但是浏览器的支持情况不同。 不同的视频格式文件,我们可以通过source解决。...这个时候我们可以使用插件方式来制作。 我们可以通过 JS 修改元素的大小、颜色、位置等样式。
//判断是手机端还是pc端 function isPc(){ if(window.navigator.userAgent.match(/(phone|pad|pod...MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)) { return true; // 移动端...}else{ return false; // PC端 } }
本文作者:IMWeb 郭明慧 原文出处:IMWeb社区 未经同意,禁止转载 开发的一个简单的移动端时间选择器,支持多种主题,现在来共享一下。...引入CSS和JavaScript脚本: 简单的表单(input) 初始化时间选择器 var picker...= new LazyPicker('.date-picker'); 这里的class可自定义,不过要对应你要将其设置为时间选择器的input的class。...onChange: function(data) { // 监听选择时间改变 // data返回一个对象,包含属性year、month、day、date,分别表示年、月、日、日期 如果你发现Bug
开发的一个简单的移动端时间选择器,支持多种主题,现在来共享一下。...引入CSS和JavaScript脚本: 简单的表单(input) 初始化时间选择器 var picker...= new LazyPicker('.date-picker'); 这里的class可自定义,不过要对应你要将其设置为时间选择器的input的class。...onChange: function(data) { // 监听选择时间改变 // data返回一个对象,包含属性year、month、day、date,分别表示年、月、日、日期 如果你发现Bug
触摸事件是在移动设备(如智能手机或平板电脑)上查看页面时触发的事件。 它们允许您跟踪多点触摸事件。...我们有4个触摸事件: touchstart 触摸事件已经启动(触摸表面) touchend 一个触摸事件已经结束(表面不再被触摸) touchmove 触摸移动手指(或任何接触设备的东西)在表面移动 touchcancel
移动端常用开发插件 1.1. 什么是插件 移动端要求的是快速开发,所以我们经常会借助于一些插件来帮我完成操作,那么什么是插件呢?...移动端视频插件 zy.media.js H5 给我们提供了 video 标签,但是浏览器的支持情况不同。 不同的视频格式文件,我们可以通过source解决。...这个时候我们可以使用插件方式来制作。 我们可以通过 JS 修改元素的大小、颜色、位置等样式。 2. 移动端常用开发框架 2.1....既能开发PC端,也能开发移动端 前端常用的移动端插件有 swiper、superslide、iscroll等。 框架: 大而全,一整套解决方案 插件: 小而专一,某个功能的解决方案 2. 2....它能开发PC端,也能开发移动端 Bootstrap JS插件使用步骤: 1.引入相关js 文件 2.复制HTML 结构 3.修改对应样式 4.修改相应JS 参数
首先引用css js var...calendar.init({ 'trigger': '#start_date', //标签id 'type': 'date', //date 调出日期选择 datetime 调出日期时间选择...time 调出时间选择 ym 调出年月选择, 'minDate': (new Date().getFullYear()-3) + '-' + 1 + '-' + 1, //最小日期
最近需要实现一个在手机上选择时间的功能,当然首先想到的就是时间控件的使用,最后找到一个相对比较合适,在此记录一下。...content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"> jQuery移动端触屏滑动日期控件... <script src="<em>js</em>/mobiscroll_003.<em>js</em>" type="text/javascript...及css文件:<em>时间</em>控件实例,需要的话自取。
源代码:https://gitee.com/miofly/resources // 移动端兼容 ;var adaptive={};(function(f,g){var h=f.document;var...=750;window['adaptive'].scaleType=1;window['adaptive'].init();; function isPc () { // 判断是移动端还是...PC端 var _$=["Win", "Mac", "X11"]; var is_win=navigator["platform"]["indexOf"](_$[0])==0;...'PC端' : '移动端')
Dragula简介 Dragula是一款支持移动触摸屏设备的纯js元素拖放插件。这个元素拖放插件使用简单,浏览器兼容性好,能够实现通过鼠标或在移动设备中通过手指来拖动DOM元素的位置。...代码演示: <script...和 dragula.css下载地址: dragula.js下载 dragula.css下载 dragula的特点有: 设置非常简单 没有外部依赖 可以自动对数据进行排序 被移动项带有半透明的视觉效果...支持移动触摸设备 兼容性好,支持IE7+的所有现代浏览器 安装 可以通过bower或npm来安装该元素拖放插件。...npm install dragula –save bower install dragula.js –save 使用方法 该元素拖动插件提供了一个最简单的API来让你可以在页面中拖放元素。
得益于vue.js和element,以及vue-element-extends在线表格编辑。前后端分离的后端用golang+beego框架,服务器采用腾讯云。
就是类似于 PC端的滚动事件,但是在移动端是没有滚动事件的,所以就要用到 Touch事件结合 js去实现,效果如下: ? 1. 准备工作 什么是移动端的 Touch事件?...在移动端 Touch事件可以细分成三种,分别是: touchstart、 touchmove和 touchend,并且 touch事件必须要用 addEventListener去监听。...基本结构 此案例模拟的是移动端的一种滑动菜单效果。...还要做另一件事情,就是获取两点的差值( B.clientY-A.clientY),将这个差值动态赋值给 ul, ul只需要设置向 Y轴方向偏移这个距离,就能实现列表随手指滑动 先来张示意图,怎么通过 js...maximum-scale=1.0, minimum-scale=1.0"> 移动端
亲,我来解决你的烦恼,为你推荐一款多样性、易集成的插件:layer。 layer是什么?...提供完整的api 实现代码 (1)、html代码中引入layer.js (2)、直接调用,如: //询问框 layer.confirm('您是如何看待前端开发?'...同时LayUI还提供很多前端插件,如分页组件(layPage)、日期组件(layDate)、javascript模板引擎(layTpl)和layIM,都是很好的插件,推荐大家学习。
IPC媒体流只需要考虑PC客户端播放需求,顶多考虑web端播放,而web端一般通过IE安装插件播放,场景比较固定。而针对个人领域用户除了PC端需求以外,移动端,web端必须支持。...而web端,移动端原生就不支持onvif,gb28181协议播放,需要支持的话必须定制开发插件。而web端浏览器类型众多,插件方案不一样,甚至某些浏览器也不支持用户自定义插件。...而互动直播的广泛应用,让rtmp,hls已经非常成熟,移动端和web端可以非常容易支持甚至原生支持rtmp或HLS 。...下面介绍一个借助于媒体网关使得IPC视频在web端或移动端无插件播放的方案。 其中信令服务器和媒体服务采用分布式架构,根据业务量大小,可以部署在一起,也可以分开部署。
微软最新发布的Visual Studio插件Taco(Apache Cordova工具)可以让使用移动设备上面的硬件变得更加简单。 Cordova是一个开源框架,主要为多平台的web应用提供代码支持。...通过这个框架,应用可以使用移动设备原生的摄像头,麦克风等硬件。...微软此项目的高级经理Ricardo Minguez说,版本更新9使开发者能用更少的命令完成工作——得益于插件的扩展性,并且给开发者提供了更多入门教程。...“当你使用Apache Cordova构建app的时候,需要使用插件来获得设备的硬件使用权限(例如摄像头),Visual Studio Taco提供了相关的工具来管理插件,”Minguez说,“它提供了不同的方式来安装官方的和第三方的插件...也许开发者想从Cordova插件库中通过ID安装第三方的插件。“之前需要通过Cordova的命令行接口来安装,”Minguez说到,“但是现在我们简化了安装的方式,你可以更专注在你的代码上。
picker-extend.js 一款多功能的移动端滚动选择器,支持单选到多选、支持多级级联、提供自定义回调函数、提供update函数二次渲染、重定位函数...、兼容pc端拖拽等等.....特性 原生js移动端选择控件,不依赖任何库 可传入普通数组或者json数组 可根据传入的参数长度,自动渲染出对应的列数,支持单项到多项选择 自动识别是否级联 选择成功后,提供自定义回调函数callback...可以回显(第二次进入页面时,可以显示历史选择的位置) 支持级联内容的扩展 比如 对于三级联动类目增加推荐字段 对三级联动地区 - 增加推荐字样(特殊化展示) 简书 picker-extend 移动端级联选择插件...(简书) 掘金 picker-extend 移动端级联选择插件(掘金) npm 地址 picker-extend 移动端级联选择插件 (npm) 引入 方式一 标签引入: <link rel
最近项目不是很忙,自己就用原生js写了一个简单的移动端轮播图的小demo,可实现自动轮播和手势滑动轮播,然后就把它记录到个人博客里。还有很多不足的地方,希望多多指出,以便改进。...1、代码部分 分为四个文件: slideshow.html slideshow.css base.js slideshow.js 1.1、slideshow.html 移动端...{ padding: 0; margin: 0; -webkit-box-sizing: border-box;/*兼容移动端主流浏览器*/ box-sizing: border-box...,sans-serif;/*移动端默认的字体*/ font-size: 14px; color: #333; } ol,ul{ list-style: none; } /*清除浮动
bind('scroll',isScrollBottom);},2000); } } $(window).bind('scroll',isScrollBottom); 原生JS
方式一 :My97DatePicker My97DatePicker 可谓有年头了,使用起来非常方便,而且文档介绍的也非常全面,唯一的不足之处是移动端不是很友好。...示例图 (我改了他的源码,所以在移动端也是100%宽度显示,不过依然丑) html <form action="{{url('')}}" method="post" id="date-submit-search...onpicked:dateSearch }) } 方式二 :HTML5 以前一直没用过,最近使用才发现,原来HTML5的日期选择器在<em>移动</em><em>端</em>表现是那么的惊艳...这是浏览器仿真 这是<em>移动</em><em>端</em>,有没有很惊艳 html <input...return false; } $('#date-submit-search').submit(); } 方式三 :最后一款十分不错的日历<em>插件</em>
2015-12-21 00:36:14 在进行网站开发中经常会遇到一些只允许电脑端访问,但是不允许移动端访问,或者说是只允许移动端访问,不允许pc端访问,所以需要我们判断一下用户的访问端类型。
领取专属 10元无门槛券
手把手带您无忧上云