JS(移动端)自己封装移动端一些常用方法
/**
* Created by Administrator on 2016/7/14.
*/
/*命名空间*/
window.lcf = {};
/*监听过渡结束的方法*/
lcf.transitionEnd = function(obj,callback) {
/*判断obj是否是一个对象 使用typeof*/
if(!obj || typeof obj !== "object") return false;
/*监听过渡结束事件*/
obj.addEventListener("webkitTransitionEnd",function () {
callback && callback(); });
obj.addEventListener("transitionEnd", function () {
callback && callback();
});
};
/*监听过渡结束的方法*/
lcf.animationEnd = function (obj,callback) {
/*判断obj是否是一个对象*/
if(!obj || typeof obj !== "object") return false;
/*监听过渡结束事件*/
obj.addEventListener("webkitAnimationEnd",function () {
callback && callback();
});
obj.addEventListener("animationEnd", function () {
callback && callback();
});
};
/*添加过渡方法*/
lcf.addTransition =function(obj){
/*基本判断*/
if(!obj || typeof obj !== "object") return false;
obj.style.transition = "all 1s";
obj.style.webkitTransition = "all 1s";
};
/*移除过渡方法*/
lcf.removeTransition =function(obj){
/*基本判断*/
if(!obj || typeof obj !== "object") return false;
obj.style.transition = "none";
obj.style.webkitTransition = "none";
};
/*上下定位方法*/
lcf.setTranslateY =function(obj,translateY){
/*基本判断*/
if(!obj || typeof obj !== "object") return false;
obj.style.transform = "translateY("+translateY+"px)";
obj.style.webkitTransform = "translateY("+translateY+"px)";
};
/*左右定位方法*/
lcf.setTranslateX =function(obj,translateX){
/*基本判断*/
if(!obj || typeof obj !== "object") return false;
obj.style.transform = "translateX("+translateX+"px)";
obj.style.webkitTransform = "translateX("+translateX+"px)";
};
/*封装tab事件方法*/
lcf.tap = function (obj,callback) {
/*基本判断*/
if(!obj || typeof obj !== "object") return false;
/*记录时间*/
var startTime = 0;
var isMove = false;
/*手指触摸到屏幕时触发touch事件*/
obj.addEventListener("touchstart", function (e) {
/*响应开始时间(毫秒)*/
startTime = Date.now();
});
/*滑动屏幕时触发touch事件*/
obj.addEventListener("touchmove", function (e) {
/*滑动*/
isMove = true;
});
/*手指离开屏幕结束时触发touch事件*/
obj.addEventListener("touchend", function (e) {
/*判断响应时间*/
if((Date.now()-startTime)<150 && !isMove){
callback && callback(e);
}
/*重置参数*/
startTime = 0;
isMove = false;
}); };
/*倒计时*/
lcf.downTime = function (endTime,obj,callback){
/*基本判断*/
if(!endTime || typeof endTime !== "string") return false;
/*基本判断*/
if(!obj || typeof obj !== "object") return false;
/*获取日期的毫秒*/
var endTime = Date.parse(endTime);
/*定时器*/
setInterval(function () {
var nowTime = +new Date();
/*2个时间的差 毫秒*/
var minus =endTime - nowTime;
/*相差的天数*/
var day = parseInt(minus/1000/60/60/24);
/*相差的小时*/
var hours = parseInt(minus/1000/60/60%24);
/*相差的分钟*/
var mintue = parseInt(minus/1000/60%60);
/*获取相差的秒*/
var second = parseInt(minus/1000%60); obj[0].innerHTML = parseInt(hours/10);
obj[1].innerHTML = hours%10;
obj[3].innerHTML = parseInt(mintue/10);
obj[4].innerHTML = mintue%10;
obj[6].innerHTML = parseInt(second/10);
obj[7].innerHTML = second%10; },1000);
callback && callback();
};
JS(移动端)自己封装移动端一些常用方法的更多相关文章
- JS提交对象数组到服务端的方法总结(C#实例)
*转载请注明出处: 作者:willingtolove: 本文链接:http://www.cnblogs.com/willingtolove/p/4741549.html 正文: 1. 方法一:利用aj ...
- JS.中文乱码,Jsp\Servlet端的解决办法
JS.中文乱码,Jsp\Servlet端的解决办法 2010-03-08 15:18:21| 分类: Extjs | 标签:encodeuricomponent 乱码 urldecoder ...
- js判断页面在pc端打开还是移动端打开
js判断页面在pc端打开还是移动端打开,分别跳转不同的index.html window.addEventListener('load', function() { // true为手机,false为 ...
- node.js中ws模块创建服务端和客户端,网页WebSocket客户端
首先下载websocket模块,命令行输入 npm install ws 1.node.js中ws模块创建服务端 // 加载node上websocket模块 ws; var ws = require( ...
- js如何判断用户是在pc端和还是移动端访问
js如何判断用户是在pc端和还是移动端访问 来源:A5技术交流 作者:wofa 时间:2014-04-25收藏本页 最近一直在忙我们团队的项目“咖啡之翼”,在这个项目中,我们为移动平台提供了一个优秀的 ...
- js判断用户是在PC端或移动端访问
js如何判断用户是在PC端和还是移动端访问. 最近一直在忙我们团队的项目“咖啡之翼”,在这个项目中,我们为移动平台提供了一个优秀的体验.伴随Android平台的红火发展.不仅带动国内智能手机行业,而 ...
- Vue.js与 ASP.NET Core 服务端渲染功能整合
http://mgyongyosi.com/2016/Vuejs-server-side-rendering-with-aspnet-core/ 原作者:Mihály Gyöngyösi 译者:oop ...
- JS学习十四天----server端运行JS代码
server端运行JS代码 话说,当今不在client使用JS代码才是稀罕事.因为web应用的体验越来越丰富,client用JS实现的逻辑也越来越多,这造成的结果就是某些差点儿一致的逻辑须要在clie ...
- js插件---WebUploader 如何接收服务端返回的数据
js插件---WebUploader 如何接收服务端返回的数据 一.总结 一句话总结: uploadSuccess有两个参数,一个是file(上传的文件信息),一个是response(服务器返回的信息 ...
随机推荐
- 高效CSS書寫規範及CSS兼容性
一.選擇器針對性說明 某一元素的多个规则集中,选择器的针对性越高,该规则集的权重也就越高.针对性相同的,后出现的规则集的权重更高. * {} /* a=0 b=0 c=0 d=0 -> spec ...
- html image -- data:image/png;base64
1, data:image/png;base64 <!DOCTYPE HTML> <html> <head> <meta http-equiv=" ...
- java学习笔记day03
1.二维数组,即一维护 int[][] arr1 = new int[3][2]; int[][] arr2 ={{2,4,3,6,22,7},{3,6,8,9},{10,13,24,5}}; pub ...
- 【计算几何初步-线段相交+并查集】【HDU1558】Segment set
Segment set Time Limit: 3000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Tota ...
- 那些 Cynthia 教我的事 之 PMSec (一)
一.ViewState的使用 在项目中,我一直在用Common的方法读取一些信息,但是Cynthia习惯将它存入ViewState中. ViewState 它是由ASP.NET页面框架管理的一个隐藏的 ...
- JQ 更改li 颜色
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- Python中安装numpy,scipy,matplotlib安装方法
这个吧,说简单也简单,说难吧我捣鼓了两天才弄出来,真是头发都急白了.其实只要一个网址就搞定了,嘿嘿 http://www.lfd.uci.edu 这里面有你需要的任何东西,当你运行python imp ...
- PHP文件缓存类
<?php /** * @desc 文件缓存 */ class Cache{ const C_FILE = '/Runtime/'; private $dir = ''; const EXT = ...
- Hibernate 体系结构简述
SessionFactory: Hibernate的关键对象,它是单个数据库映射关系经过编译后的内存镜像,同时它是线程安全的.它是生成Session的工厂,本身需要依赖于ConnectionProvi ...
- Jquery一个slideToggle搞定div的隐藏与显示
Jquery一个slideToggle搞定div的隐藏与显示 <!DOCTYPE html> <html> <head> <script src=" ...