jquery计算鼠标和指定元素之间距离的方法


Posted in Javascript onJune 26, 2015

本文实例讲述了jquery计算鼠标和指定元素之间距离的方法。分享给大家供大家参考。具体实现方法如下:

(function() {
  var mX, mY, distance,
    $distance = $('#distance span'),
    $element = $('#element');
  function calculateDistance(elem, mouseX, mouseY) {
    return Math.floor(Math.sqrt(Math.pow(mouseX - (elem.offset().left+(elem.width()/2)), 2) + Math.pow(mouseY - (elem.offset().top+(elem.height()/2)), 2)));
  }
  $(document).mousemove(function(e) { 
    mX = e.pageX;
    mY = e.pageY;
    distance = calculateDistance($element, mX, mY);
    $distance.text(distance);     
  });
})();

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
FCK调用方法..
Dec 21 Javascript
Prototype使用指南之range.js
Jan 10 Javascript
精通Javascript系列之数据类型 字符串
Jun 08 Javascript
使用js解决由border属性引起的div宽度问题
Nov 26 Javascript
JS中用childNodes获取子元素换行会产生一个子元素
Dec 08 Javascript
JavaScript用构造函数如何获取变量的类型名
Dec 23 Javascript
详解Angular的双向数据绑定(MV-VM)
Dec 26 Javascript
基于Vue的SPA动态修改页面title的方法(推荐)
Jan 02 Javascript
浅谈layui 数据表格前后台传值的问题
Sep 12 Javascript
Node配合WebSocket做多文件下载以及进度回传
Nov 07 Javascript
d3.js实现图形缩放平移
Dec 19 Javascript
解决vue的router组件component在import时不能使用变量问题
Jul 26 Javascript
jquery操作angularjs对象
Jun 26 #Javascript
jQuery检查事件是否触发的方法
Jun 26 #Javascript
js限制input标签中只能输入中文
Jun 26 #Javascript
jQuery实现按钮只点击一次后就取消点击事件绑定的方法
Jun 26 #Javascript
浅谈JavaScript异常处理语句
Jun 26 #Javascript
javascript实现一个数值加法函数
Jun 26 #Javascript
javascript排序函数实现数字排序
Jun 26 #Javascript
You might like
全国FM电台频率大全 - 5 内蒙古自治区
2020/03/11 无线电
Get或Post提交值的非法数据处理
2006/10/09 PHP
php将会员数据导入到ucenter的代码
2010/07/18 PHP
php实现中文转数字
2016/02/18 PHP
JS仿百度搜索自动提示框匹配查询功能
2013/11/21 Javascript
Node.js中AES加密和其它语言不一致问题解决办法
2014/03/10 Javascript
基于node.js依赖express解析post请求四种数据格式
2017/02/13 Javascript
angularJS的radio实现单项二选一的使用方法
2018/02/28 Javascript
JS实现获取进今年第几天是周几的方法分析
2018/06/27 Javascript
Vue-cli@3.0 插件系统简析
2018/09/05 Javascript
vue动态配置模板 'component is'代码
2019/07/04 Javascript
VsCode与Node.js知识点详解
2019/09/05 Javascript
JavaScript组合设计模式--改进引入案例分析
2020/05/23 Javascript
jQuery实现tab栏切换效果
2020/12/22 jQuery
[01:01:31]2018DOTA2亚洲邀请赛3月29日小组赛B组 Mineski VS paiN
2018/03/30 DOTA
Python计算已经过去多少个周末的方法
2015/07/25 Python
Python读大数据txt
2016/03/28 Python
python用reduce和map把字符串转为数字的方法
2016/12/19 Python
Python实现Dijkstra算法
2018/10/17 Python
pandas计数 value_counts()的使用
2019/06/24 Python
python sqlite的Row对象操作示例
2019/09/11 Python
python numpy之np.random的随机数函数使用介绍
2019/10/06 Python
Python如何使用BeautifulSoup爬取网页信息
2019/11/26 Python
pytorch模型存储的2种实现方法
2020/02/14 Python
全天然狗零食:Best Bully Sticks
2016/09/22 全球购物
UNIONBAY官网:美国青少年服装品牌
2019/03/26 全球购物
美国医生配方营养补充剂供应商:Healthy Directions
2019/07/10 全球购物
英国最受信任的在线眼镜商之一:Fashion Eyewear
2019/10/31 全球购物
马来西亚在线购物:POPLOOK.com
2019/12/09 全球购物
如何判断一段程序是由C 编译程序还是由C++编译程序编译的
2013/08/04 面试题
名词解释型面试题(主要是网络)
2013/12/27 面试题
工程安全员岗位职责
2014/03/09 职场文书
餐饮商业计划书范文
2014/04/29 职场文书
小学生十佳少年事迹材料
2014/08/20 职场文书
幼师大班个人总结
2015/02/13 职场文书
开展警示教育活动总结
2015/05/09 职场文书