手机端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:手指在屏幕上滑动的时 ...
随机推荐
- 79 两个整数集合A和B,求其交集
[本文链接] http://www.cnblogs.com/hellogiser/p/ab-intersect.html [题目] 两个整数集合A和B,求其交集. [分析] 1. 读取整数集合A中 ...
- ACM/ICPC 之 DP-整数划分问题初探 (POJ1221)
写下这道题的原因很简单= =,因为这一题的状态转移方程不好找,另一方面,我看到很多针对这一题写的解题报告都把累加状态说得模棱两可,甚至直接说成了一个单一状态,弄得本是菜鸟的我硬生生折磨了一上午画了几个 ...
- 线条围绕 div 中心转圈 效果
1. 用到知识: CSS:animate ,clipe 2.原理: 用clip 属性 将div 切边 ,会出现 切边的动态效果,然后内部的div 遮住外部的div ,流出一部分 作为边: 就是旋 ...
- JS 循环练习
规律 大范围套小范围 循环 分支语句 switch case 嵌套 死循环 while(true) 打破循环 break continue while(true) ...
- sql server 取日期
Select CONVERT(varchar(100), GETDATE(), 0): 05 16 2006 10:57AM Select CONVERT(varchar(100), GETDATE( ...
- 优化MyBatis配置文件中的配置
一.为实体类定义别名,简化sql映射xml文件中的引用 之前,我们在sql映射xml文件中的引用实体类时,需要写上实体类的全类名(包名+类名),如下: <!-- 创建用户(Create) --& ...
- LeetCode : 287. Find the Duplicate Number
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAACRAAAAMMCAYAAAAhQhmZAAAMFGlDQ1BJQ0MgUHJvZmlsZQAASImVlw ...
- EF – 2.EF数据查询基础(上)查询数据的实用编程技巧
目录 5.4.1 查询符合条件的单条记录 EF使用SingleOrDefault()和Find()两个方法查询符合条件的单条记录. 5.4.2 Entity Framework中的内部数据缓存 DbS ...
- js获取url参数值(HTML之间传值)
<h3>未设置设备: <a href="javascript:addTab('设备列表','PKE_DeviceContent/PKE_DeviceContent.aspx ...
- AXURE在原型设计中的应用
转: http://uedc.163.com/2248.html 前言 什么是原型呢? 产品原型简单的说就是产品设计成形之前的一个简单框架,对网站来讲,就是将页面模块.元素进行粗放式的排版和布局,深入 ...