手机页面touch触摸事件
请看示例:
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
<style>
.main-div{
font-size:4rem;
width:100%;
}
</style>
<script type="text/javascript" src="jquery-2.1.1.js"></script>
</head>
<body>
<div class="main-div">
hello wor1ld!
</div>
</body>
</html> <script type="text/javascript">
$(".main-div").bind("touchstart", function (e) { //触摸开始的时候触发
//e.preventDefault(); //阻止出现滚动条
$(this).css("background-color", "#e5e5e5");
}).bind("touchend", function (e) { //手指在屏幕上滑动的时候触发
$(this).css("background-color", "white");
}).bind("touchmove", function (e) { //触摸结束的时候触发
$(this).css("background-color", "white");
});
</script>
延伸阅读文章: http://www.w3school.com.cn/jquerymobile/jquerymobile_events_touch.asp
手机页面touch触摸事件的更多相关文章
- touch触摸事件
事件对象 事件对象是用来记录一些事件发生时的相关信息的对象.事件对象只有事件发生时才会产生,并且只能是事件处理函数内部访问,在所有事件处理函数运行结束后,事件对象就被销毁! W3C DOM把事件对象作 ...
- 关于windows phone 8.1系统手机对html5触摸事件的支持情况
近日购入一部微软Lumia 640手机,目的主要就是为了测试年中开发完成的响应式移动web项目,同时也为了将来升级win10 mobile系统.由于我们的项目目前只考虑支持IOS与Android系统, ...
- Touch事件 移动端touch触摸事件
<!-- HTML5 --> <!DOCTYPE html> <html> <head> <title>TouchEvent测试</t ...
- 移动端touch触摸事件(滑动效果和手势操作)
一.定义 ①touch是移动端的触摸事件,而且是一组事件,主要有以下事件: touchstart 事件:当手指触摸屏幕的时候触发 touchmove 事件:当手指在屏幕来回滑动的时候触发 touche ...
- 移动端-js触摸事件
开发者工具 在移动开发中,一种较为容易的做法是,先在桌面上开始原型设计,然后再在打算要支持的设备上处理移动特有的部分.多点触摸正是难以在PC上进行测试的那些功能之一,因为大部分的PC都没有触摸输入. ...
- 移动端WEB开发,click,touch,tap事件浅析
一.click 和 tap 比较 两者都会在点击时触发,但是在手机WEB端,click会有 200~300 ms,所以请用tap代替click作为点击事件. singleTap和doubleTap 分 ...
- web开发,click,touch,tap事件浅析
一.click 和 tap 比较 两者都会在点击时触发,但是在手机WEB端,click会有 200~300 ms,所以请用tap代替click作为点击事件. singleTap和doubleTap 分 ...
- 移动端JS 触摸事件基础
一.手机上的触摸事件 基本事件: touchstart //手指刚接触屏幕时触发 touchmove //手指在屏幕上移动时触发 touchend //手指从屏幕上移开时触发 ...
- 移动端js触摸事件大全
一.手机上的触摸事件 基本事件: touchstart //手指刚接触屏幕时触发 touchmove //手指在屏幕上移动时触发 touchend //手指从屏幕上移开时触发 下面这 ...
随机推荐
- Linux系统挂载数据盘
参考:http://help.aliyun.com/knowledge_detail/5974154.html?spm=5176.788314850.3.2.hUqwXo 1.在阿里云上购买了服务器, ...
- 无需写try/catch,也能正常处理异常 (转)
原文地址: http://www.cnblogs.com/artech/archive/2012/10/28/automatic-exception-handling-aspnet.html 对于企业 ...
- jquery如何在异步方式中给全局变量赋值
定义一个全局全量,例如:var i=0;然后调用jquery的一个函数 $.get(url, function(data) {i=9;})alert(i);得到的是0而不是9. var i=0; ...
- xcode 插件地址
http://finalshares.com/read-1104 curl -fsSL https://raw.githubusercontent.com/supermarin/Alcatraz/de ...
- openlayers中实现自定冒泡的效果
自定义的Openlayers.Popup.FreshCloud继承自Openlayers.Popup.Framed,实现了比较简洁的冒泡效果,详细代码如下 /** * Class: OpenLayer ...
- Asprise-OCR的使用
Asprise-OCR下载地址: http://asprise.com/product/ocr/download.php?lang=csharp 其中需要使用的3个dll是AspriseOCR.dll ...
- 安装完Pydev却无法创建Python工程
为了方便以后工作,今天在ADT里面安装了Pydev(http://pydev.org/updates),可是安装完之后,新建项目的时候却找不到Pydev,perference中也没有. 紧接着尝试安装 ...
- NK3C系统中ID的汉语名称
系统中的ID有需要显示给使用者看的,统一用"编号",不要用ID或者编码 例如: SampleId 样本编号 正确 样本编码 错误 样本ID 错误 如果见到系统中有用到的,修正即可. ...
- 判断是手机还是PC端访问
/*判断手机*/ //判断是手机浏览还是pc //平台.设备和操作系统 var system = { win: false, mac: false, xll: false, ipad: false } ...
- .NET 工具类ObjectDumper 打印对象
// Comes from the LINQ samples provided by Microsoft //Copyright (C) Microsoft Corporation. All righ ...