js书写移动端常用事件_js 移动端 手写事件-程序员宅基地

技术标签: JS移动端  移动端  移动端事件  过渡动画事件  

 

移动端的事件是新增的,叫“touch”事件 触摸事件。

click点击事件依然支持,会有300ms的延迟

touchstart, tap, click的加载快慢顺序

touchstart > tap > click

 

开始触摸 :touchstart

触摸移动:touchmove

触摸结束:touchend

 

事件对象

获取手指按下的位置

在touchstart 和 touchmove 中:

e . touches[0].clientX

在touchend中:

e . changedTouches[0].clientX

 

当一个元素过渡完成之后会触发”transitionend“事件

注意:只有过渡结束事件,没有过渡开始事件

当一个元素动画开始的时候,会触发”animationstart“事件

当一个元素动画结束的时候,会触发”animationend”事件

 

书写移动端通常使用Zepto库

Zepto是一个轻量级的针对现代高级浏览器的JS库,它与jQuery有着类似的api

zepto是分模块的,使用什么模块都需要下载,很方便

Zepto的touch模块中的一些常用自定义移动端事件

swipe: 滑动

swipeLeft:左滑动

swipeRight:右滑动

swipeUp:上滑动

swipeDown:下滑动

tap:触碰

doubleTap:触碰两次

singleTap:触碰一次

longTap:长按(750ms之后执行)

 

客户端需要书写的meta标签 约束视口

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no" id="viewport" />

 

 

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_42433932/article/details/81159424

智能推荐

如何查看服务器关机日志信息,查看服务器关机日志-程序员宅基地

文章浏览阅读2.6k次。查看服务器关机日志 内容精选换一换为加强对系统数据的容灾管理,云堡垒机支持配置日志备份,提高审计数据安全性和系统可扩展性。本小节主要介绍如何在系统配置Syslog服务器参数,将日志远程备份至Syslog服务器。开启远程备份后,系统默认在每天零点备份前一天的系统数据。以天为单位自动备份,生成日志文件,并上传到Syslog服务器相应路径。支持备份至Syslog服务器的日志包括密钥对鉴权方式的Windo..._服务器自动关机日志

Pycharm中出现Comparison with None performed with equality operators-程序员宅基地

文章浏览阅读4.5k次,点赞7次,收藏7次。Pycharm中出现Comparison with None performed with equality operators_comparison with none performed with equality operators

2017年全国大学生电子设计竞赛综合测评题目解析——2022更新(方波生成,方波分频,三角波,加法器,滤波器,正弦波))_17电赛综测题解析-程序员宅基地

文章浏览阅读1.1w次,点赞5次,收藏50次。这里写自定义目录标题一、题目二、方案设计三、具体参数设计1.方波 12.方波 23.三角波4.合成波5.正弦波使用Multisim 14仿真,文件可联系博主获取。2017 年电子设计竞赛综合测评一、题目二、方案设计使用给定的共计 4 个运算放大器和 1 个数字芯片双 D 触发器,完成 5 个波形,其中:(1)使用 1 个运放产生 20 KHz 的方波 1,搭建 RC 振荡电路和滞回比较器,该电路比较重要,既可以产生方波,也可以产生三角波,可以用于方波发生器和三角波发生器;(2)使用 74LS_17电赛综测题解析

国基北盛 openstack 云平台搭建保姆级步骤_国基北盛openstack-程序员宅基地

文章浏览阅读3.3k次,点赞17次,收藏69次。国基北盛 openstack 云平台搭建保姆级步骤_国基北盛openstack

简单解释一下SDK、JDK、JRE、JVM之间的区别以及联系_sdk和jdk的关系-程序员宅基地

文章浏览阅读1.3k次。一、JDK与JRE简单的说:JDK是面向开发人员使用的SDK,它提供了Java的开发环境和运行环境。SDK是Software Development Kit 一般指软件开发包,可以包括函数库、编译程序等。JDK就是Java Development KitJRE是Java Runtime Enviroment是指Java的运行环境,是面向Java程序的使用者,而不是开发者。如果..._sdk和jdk的关系

Flex DateField 日期范围_flex中datefiled显示年月-程序员宅基地

文章浏览阅读941次。<![CDATA[ import mx.controls.DateField; [Bindable] private var today:Date = new Date(new Date()

随便推点

UR5机械臂仿真实例(四)视觉引导抓取pick&place [ubuntu20.04+ROS noetic+gazebo11]_gazebo 机械臂视觉抓取-程序员宅基地

文章浏览阅读825次,点赞3次,收藏14次。UR5机械臂仿真实例,实现YOLOv5视觉引导抓取pick&place。_gazebo 机械臂视觉抓取

MPC5748G开发笔记-----开发环境安装_s32 design studio for power architecture庐 2017.r1 -程序员宅基地

文章浏览阅读908次。MPC5748G开发笔记-----开发环境安装文章目录MPC5748G开发笔记-----开发环境安装前言一、下载S32 Design Studio for Power Architecture二、下载MBD建模工具箱下载 MBDToolbox_MPC57xx_3.0.0_20190218三、安装相应的安装包总结前言在Matlab中做模型测试需要用单片机环境验证,为了快速验证simulink模型的正确性,可以用的dspace等硬件平台,为了打造一个简单的硬件平台选用MPC5748G芯片,该芯片在新能_s32 design studio for power architecture庐 2017.r1 update 2 - mpc574xx sdk

web前端期末大作业 基于HTML+CSS+JavaScript程序员个人博客模板(web学生作业源码)-程序员宅基地

文章浏览阅读180次。校园篮球网页设计、足球体育运动、体育游泳运动、兵乓球 、网球、等网站的设计与制作。️ 大学生校园运动静态HTML网页设计作品,采用DIV CSS布局制作,内容包括:校园运动、运动技巧、运动规则、技术规则、经典动作。页面主体内容区域宽度为1200PX。网页整体使用CSS设置了网页背景图片。页面精美包含多个排版布局,学生网页作业水平制作。 一套优质的网页设计应该包含 (具体可根据个人要求而定)网站布局方面:计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构_程序员个人博客模板

《卸甲笔记》-PostgreSQL和Oracle的SQL差异分析之五:函数的差异(六)_postgresql lnnvl-程序员宅基地

文章浏览阅读786次。PostgreSQL是世界上功能最强大的开源数据库,在国内得到了越来越多机构和开发者的青睐和应用。随着PostgreSQL的应用越来越广泛,Oracle向PostgreSQL数据库的数据迁移需求也越来越多。数据库之间数据迁移的时候,首先是迁移数据,然后就是SQL、存储过程、序列等程序中不同的数据库中数据的使用方式的转换。下面根据自己的理解和测试,写了一些SQL以及数据库对象转换方面的文章,不足之处..._postgresql lnnvl

在centos-8环境下使用Kubespray部署Kubernetes生产集群-程序员宅基地

文章浏览阅读876次,点赞15次,收藏27次。在centos-8环境下使用Kubespray部署Kubernetes生产集群

计算机应用基础课本前言,计算机应用基础探析-程序员宅基地

文章浏览阅读336次。摘要:《计算机应用基础》是中职学校学生必修的公共基础课。本文通过对中职计算机应用基础教学过程中如何通过培养学生正确的学习态度,激发学生的学习兴趣,优化授课内容,采用适当的教学方法,以提高中职学校学生计算机基本应用技能,满足其学习和实际应用需求提出了一些个人看法和建议。关键词:中职学校 计算机应用基础 中职学生 教学方法1、前言中等职业教育是一个特殊的教育类型。它不同于以理论知识为主、以升学为目的普..._计算机应用基础前言

推荐文章

热门文章

相关标签