多语言展示
当前在线:1238今日阅读:167今日分享:16

jquery 怎样获取触屏坐标

jquery是一个javascript的封装库,javascript提供了touch事件(包括touchstart,touchmove,touchend)等来获取触屏的信息,本文将详细介绍jquery 怎样获取触屏坐标,详细的例子说明如下。
工具/原料
1

html+css+js

2

jquery库

3

html编辑器sublime_text

方法/步骤
1

第一步,首先我们前往官网查看一下touch事件的详细说明和使用方法,clientX / clientY:      //触摸点相对浏览器窗口的位置pageX / pageY:       //触摸点相对于页面的位置screenX  /  screenY:    //触摸点相对于屏幕的位置详细如下图

2

第二步,为了我们更加方便的对javascript的操作,我们使用html编辑器sublime_text,详细如下图

3

第三步,我们创建一个html文件,然后写入网页的基本代码,引入jquery,详细如下图

4

第四步,我们写入一个触屏事件touchstart,然后利用screenX,screenY获取相对于屏幕的坐标,详细代码如下图

5

第五步,我们把html文件拖到浏览器中打开,然后按f12,然后在按快捷键ctrl+shift+m调出手机模式,也可以点击下面的图标,详细如下图

6

第六步,手机模式下,我们可以调试了,鼠标模拟手指触屏,每次点击都获取当前距离屏幕的坐标,详细如下图

注意事项

如果对你有帮助,请在下面投个票或者点个赞

推荐信息