手机端touchstart,touchmove,touchend事件,优化用户划入某个可以点击LI的效果
在我们滑动手机的时候,如果LI或者DIV标签可以点击,那么在移动端给用户一个效果
/*id为添加效果LI上的UL的ID,或者是当前DIV的ID*/
function doTouchPublic(id){
setTimeout(function(){
var obj=document.getElementById(id);
touchPublic.tagUltagDiv(obj);
},300);
};
var touchPublic={
tagUltagDiv:function(obj){
var objAll;
/*如果对象为UL,那么给LI添加事件,否则给DIV当前对象添加事件*/
if(obj.tagName=="UL"){
objAll=obj.childNodes;
}else{
objAll=obj;
}
touchPublic.touchMoveEndIf(objAll);
},
/*li做委托事件,on为JQ中委托事件*/
touchMoveEndIf:function(obj){ $(obj).on('touchstart',function(){
touchPublic.touchObjstart(this,"objRowOver");
})
/*触摸滑动,e.preventDefault();是为了让end触发*/
$(obj).on('touchmove',function(){
touchPublic.touchObjend(this,"objRowOver");
});
/*触摸离开*/
$(obj).on('touchend',function(){
touchPublic.touchObjend(this,"objRowOver");
}); },
touchObjstart:function(that,color){
$(that).addClass(color);
},
touchObjend:function(that,color){
if($(that).attr('class')==color){
$(that).removeClass(color);
}
}
}
手机端touchstart,touchmove,touchend事件,优化用户划入某个可以点击LI的效果的更多相关文章
- 移动端的touchstart,touchmove,touchend事件中的获取当前touch位置
前提:touchstart,touchmove,touchend这三个事件可以通过原生和jq绑定. 原生:document.querySelector("#aa").addEven ...
- touchstart,touchmove,touchend事件 写法
jQuery写法: $('#id').on('touchstart',function(e) { var _touch = e.originalEvent.targetTouches[0]; var ...
- touchstart和touchend事件
touchstart和touchend事件 移动互联网是未来的发展趋势,现在国内很多互联网大佬都在争取移动这一块大饼,如微信及支付宝是目前比较成功的例子,当然还有各种APP和web运用. 由于公司的需 ...
- 获取touchstart,touchmove,touchend 坐标
简单说下如何用jQuery 和 js原生代码获取touchstart,touchmove,touchend 坐标值: jQuery 代码: $('#id').on('touchstart',funct ...
- touchstart,touchmove,touchend触摸事件的小小实践心得
近段时间使用html5开发一个公司内部应用,而触摸事件必然是移动应用中所必须的,刚开始以为移动设备上或许也会支持鼠标事件,原来是不支持的,好在webkit内核的移动浏览器支持touch事件,并且打包成 ...
- 移动端touchstart,touchmove,touchend
近段时间使用html5开发一个公司内部应用,而触摸事件必然是移动应用中所必须的,刚开始以为移动设备上或许也会支持鼠标事件,原来是不支持的,好在webkit内核的移动浏览器支持touch事件,并且打包成 ...
- js 手机端触发事事件、javascript手机端/移动端触发事件
处理Touch事件能让你跟踪用户的每一根手指的位置.你可以绑定以下四种Touch事件: touchstart: // 手指放到屏幕上的时候触发 touchmove: // 手指在屏幕上移动的时候触发 ...
- 手机端html5触屏事件(touch事件)
touchstart:触摸开始的时候触发 touchmove:手指在屏幕上滑动的时候触发 touchend:触摸结束的时候触发 而每个触摸事件都包括了三个触摸列表,每个列表里包含了对应的一系列触摸点( ...
- (转)手机端html5触屏事件(touch事件)
本文转载自:http://blog.sina.com.cn/s/blog_51048da70101f0ex.html touchstart:触摸开始的时候触发 touchmove:手指在屏幕上滑动的时 ...
随机推荐
- C++实现VPN工具之代码示例
创建.连接.挂断.删除VPN实现起来并不难,下面给出一套比较完整的代码.该段代码只是示例代码,但是已经通过了编译,对API的使用和VPN操作步骤是没问题的.具体每个API代表的意义可以参看<C+ ...
- linux琐碎知识点
1.awk的使用方式,pattern支持正则表达式 awk 'pattern{action}' {filenames} 其中 pattern 表示 AWK 在数据中查找的内容,而 action 是在找 ...
- FastReport报表控件使用技巧总结
FastReport报表控件使用技巧总结 1.FastReport中如何访问报表中的对象? 可以使用FindObject方法. TfrxMemoView(frxReport1.FindObject(' ...
- yii框架详解 之 CActiveRecord
[特别注意事项] 1.所有要用于访问的属性,都要先在类中声明(原数据表中的字段是默认可访问的,自定义的属性值,一定要先在类中添加声明,才可以正常访问) 2.数据库的表面引用,一般都是有固定的数据库表前 ...
- SQL Server 2008登录错误:无法连接到(local)的解决方法
1.服务器类型我们选择了“数据库引擎”时,查找里面的可登录用户名是没有的,下边的服务器名称只显示为“(local)”,连“Windows 身份验证”都无法登录. 如果朋友们和我出错的问题是一样请看下面 ...
- codeforces 515C. Drazil and Factorial 解题报告
题目链接:http://codeforces.com/problemset/problem/515/C 题目意思:给出含有 n 个只有阿拉伯数字的字符串a(可能会有前导0),设定函数F(a) = 每个 ...
- 【leetcode】Remove Duplicates from Sorted Array I & II(middle)
Given a sorted array, remove the duplicates in place such that each element appear only once and ret ...
- Linux内核补丁升级
如果机器已经联网,直接利用包管理工具更新,需要注意的是现在3.0以上的内核引入了签名机制,需要导入签名的key,参考步骤如下: 1.导入keyrpm --import https://www.elre ...
- 108. Convert Sorted Array to Binary Search Tree
题目: Given an array where elements are sorted in ascending order, convert it to a height balanced BST ...
- 使用autolayout,设置子控件的宽度 与父视图的宽度成比例大小(这样类似可以设置多个按钮平均横屏排列)
橙色是父视图,假设约束如上图. 绿色是子视图.重点宽度比例设置: 1. control-drag 选择 equal width2. 选中上面那个约束 注意 first item 和 second it ...