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

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. SqlServer-无限递归树状图结构设计和查询

    在现实生活中,公司的部门设计会涉及到很多子部门,然后子部门下面又存在子部门,形成类似判断的树状结构,比如说评论楼中楼的评论树状图,职位管理的树状图结构等等,实现类似的树状图数据结构是在开发中经常出现的 ...

  2. iOS--使用UIImageView进行GIF动图播放

    大家好,好久没有跟新了.其实也就昨天到今天的时间. 前言:实际上,GIF动图文件中包含了一组图片及其信息数组,这些信息数据记录着这一组图片中各张图片的播放时长等信息,我们可以将图片和这些信息或取出来, ...

  3. Cursor的用法

    文章主要来自于::::http://www.cnblogs.com/TerryBlog/archive/2010/07/05/1771459.html 主要为了自己学习方便,侵删!!!! 使用过 SQ ...

  4. Java中的可变长参数

    可变长参数的定义 与一般方法没多大差别,只不过形参多了...(三个点) 方法名(数据类型 ... 变量名){} 小案例: public class ParamDemo { public static ...

  5. android视频播放器

    RTSP(Real Time Streaming Protocol),RFC2326,实时流传输协议,是TCP/IP协议体系中的一个应用层协议,由哥伦比亚大学.网景和RealNetworks公司提交的 ...

  6. 解决eclipse配置Tomcat时找不到server选项(Mac通用)

    集成Eclipse和Tomcat时找不到server选项: 按照网上的步骤如下: 在Eclipse中,窗口(window)——首选项(preferences)——服务器(Server)——运行时环境( ...

  7. 源映射(Source Map)详解

    一.什么是源映射 为了提高性能,很多站点都会先压缩 JavaScript 代码然后上线, 但如果代码运行时出现错误,浏览器只会显示在已压缩的代码中的位置,很难确定真正的源码错误位置. 这时源映射就登场 ...

  8. jquery固定在顶部的导航菜单

    体验效果:http://hovertree.com/texiao/jquery/6.htm HTML文件代码: <!DOCTYPE html PUBLIC "-//W3C//DTD X ...

  9. 【单页应用】理解MVC

    前言 之前我们为view引入了wrapperSet的概念,想以此解决view局部刷新问题,后来发现这个方案不太合理 view里面插入了业务相关的代码,事实上这个是应该剥离出去,业务的需求千奇百怪,我们 ...

  10. c#的那些有效性判断

    在开发中合理的对象有效性判断是程序健壮性的重要保障,也有利于提高程序的执行效率.本人简单总结了几个需要判断对象是否为空的例子,分享如下: 一.集合对象中可以包含空对象,遍历集合对象时要同时判断集合中的 ...