####需求：
做项目中遇到一个这样的需求，点击属性菜单节点，出现显示框，显示框的位置随着鼠标点击的位置距离而改变。
###教程：
clientX 事件属性
http://www.runoob.com/jsref/event-clientx.html
clientY 事件属性
http://www.runoob.com/jsref/event-clienty.html
####基本定义
clientX 事件属性返回当事件被触发时鼠标指针向对于浏览器页面（或客户区）的水平坐标。客户区指的是当前窗口。
clientY 事件属性返回当事件被触发时鼠标指针向对于浏览器页面（客户区）的垂直坐标。 客户区指的是当前窗口。
####遇到的坑
这个功能在一些浏览器里面的兼容性和适配性的介绍
####jQuery右键点击弹出菜单，菜单随鼠标点击的位置的变化而变化
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script src="http://code.jquery.com/jquery-1.8.0.min.js"></script></head><body><div class="dropdown open" id="treeContextMenu" style="display: none;position: absolute"><ul class="dropdown-menu"><li><a href="javascript:;" id="toUpdateBtn">编辑</a></li><li><a href="javascript:;" id="deleteBtn">删除</a></li></ul></div></body><script>//屏蔽浏览器右键菜单document.oncontextmenu = function() {return false;}//按下鼠标$(document).mousedown(function(e) {var key = e.which;//获取鼠标键位if(key == 3)//(1:代表左键； 2:代表中键； 3:代表右键) {//获取右键点击坐标var x = e.clientX;var y = e.clientY;$("#treeContextMenu").show().css({left: x,top: y});}});//点击任意部位隐藏$(document).click(function() {$("#treeContextMenu").hide();})</script></html>
原文作者：祈澈姑娘
关注「编程微刊」公众号 ，在微信后台回复「领取资源」，获取IT资源300G干货大全。
