鼠标/手指相对于元素的坐标:鼠标或手指当前的位置 - 元素距离文档的位置

px转百分比:px / 文档尺寸 * 100

获取手指触摸在屏幕中相对于元素的坐标(px转百分比):

$('#div').on('click',function(e){

    //获取手指抬起时在文档中的位置
e = e.originalEvent.changedTouches[0];
//计算偏移值,获取手指相对于元素的坐标
var pageX = e.pageX-$(this).offset().left, pageY = e.pageY-$(this).offset().top;
//px转百分比
pageX = pageX / $(this).width() * 100;
pageY = pageY / $(this).height() * 100; });

鼠标/手指相对于元素的坐标(px转百分比)的更多相关文章

  1. 详细解析 JavaScript 获取元素的坐标

    引言 最近突然看到了有关图片懒加载的问题,大致意思就是初始状态下页面只加载浏览器可视区域的图片,剩余图片在当浏览器可视区域滚动到其位置时才开始加载.貌似现在许多大型网站都有实现懒加载,所以我便就此问题 ...

  2. js 获取 鼠标位置 和获取元素位置

    ]; body.addEventListener("mousemove", outpostion); function outpostion() { console.log(&qu ...

  3. [WPF]获取鼠标指针下的元素

    原文:[WPF]获取鼠标指针下的元素   [WPF]获取鼠标指针下的元素 周银辉 以前写过一些GetElementUnderMouse之类的函数,要用到坐标换算而显得有些麻烦(特别是当元素有XXXTr ...

  4. cursor CSS属性定义鼠标指针悬浮在元素上时的外观。

    1 1 cursor CSS属性定义鼠标指针悬浮在元素上时的外观. https://developer.mozilla.org/zh-CN/docs/Web/CSS/cursor 概述 cursor  ...

  5. jquery获取当前元素的坐标

    jquery获取当前元素的坐标 1,获取对象 var obj = $("#id号"); 或  var obj = $(this); 实例中我获取的对象是弹出窗口按钮,这样创建的新窗 ...

  6. win10 uwp 获得元素绝对坐标

    有时候需要获得一个元素,相对窗口的坐标,在修改他的位置可以使用. 那么 UWP 如何获得元素坐标? 我提供了一个方法,可以获得元素的坐标. 首先需要获得元素,如果没有获得元素,那么如何得到他的坐标? ...

  7. WPF如何得到一个在用户控件内部的元素的坐标位置

    例如有这样一个用户控件: <UserControl d:DesignHeight="100" d:DesignWidth="200" ...> &l ...

  8. 2018-8-10-win10-uwp-获得元素绝对坐标

    title author date CreateTime categories win10 uwp 获得元素绝对坐标 lindexi 2018-08-10 19:16:51 +0800 2018-2- ...

  9. dotnet 读 WPF 源代码笔记 布局时 Arrange 如何影响元素渲染坐标

    大家是否好奇,在 WPF 里面,对 UIElement 重写 OnRender 方法进行渲染的内容,是如何受到上层容器控件的布局而进行坐标偏移.如有两个放入到 StackPanel 的自定义 UIEl ...

随机推荐

  1. Linux命令详解之—tail命令

    tail命令也是一个非常常用的文件查看类的命令,今天就为大家介绍下Linux tail命令的用法. 更多Linux命令详情请看:Linux命令速查手册 Linux tail命令主要用来从指定点开始将文 ...

  2. js圣诞节倒计时网页

    在线预览:http://keleyi.com/keleyi/phtml/jstexiao/17.htm 以下是代码: <!DOCTYPE html> <html xmlns=&quo ...

  3. SharePoint 2013 使用JavaScript对象模型配置智能提示

    前言 默认在VS2012/2013中编写SharePoint JavaScript 客户端对象模型,都没有智能感知的功能,用起来非常麻烦:其实,我们可以手动配置一下,让JavaScript可以进行智能 ...

  4. 去除GridView选中时的蓝色背景

    解决办法: android:listSelector="#00000000" android:listSelector="@android:color/transpare ...

  5. JS判断用户手机是IOS还是Android

    $(function () { var u = navigator.userAgent, app = navigator.appVersion; var isAndroid = u.indexOf(' ...

  6. iOS之深拷贝与浅拷贝

    在最开始,我们需要清楚一些关于内存分配方式的基础知识. 一般来说分为栈.堆.静态变量存储区.全局变量存储区.代码区. 前两个大家都懂的.通常将后三个合并称之为静态存储区,存储的是一些全局变量.静态变量 ...

  7. iOS 直播-实现后台录音并推流

    iOS 直播-实现后台录音并推流 从一个月前开始开始接收公司的直播类app.到今天为止测试都已接近尾声,但是产品哥哥加了一个要求,就是在app进入后台后也实时保证录音并且推流. 刚听到这个的时候我也是 ...

  8. Android Material Design 兼容库的使用

    Android Material Design 兼容库的使用 mecury 前言:近来学习了Android Material Design 兼容库,为了把这个弄懂,才有了这篇博客,这里先推荐两篇博客: ...

  9. android 事件分发机制

    1.View的事件分发机制 一个button,简单一点就是onTouch,还有onclick事件,我们一个一个来分析 首先响应的是dispatchTouchEvent public boolean d ...

  10. zDiaLog弹出层

    zDiaLog弹出层  立即下载 插件描述:zDiaLog弹出层 弹出框: 代替window.open.window.alert.window.confirm:提供良好的用户体验: 水晶质感,设计细腻 ...