获取鼠标单击的位置

使用:将下两个方法赋值到代码中即可,

直接调用displayCursorPosition(event)方法就行。

// 获取鼠标位置
		function displayCursorPosition(event)  
		{  
		  if (typeof event == "undefined")  
		  {  
		    event = window.event;  
		  }  
		  
		  var scrollingPosition = getScrollingPosition();  
		  var cursorPosition = [0, 0];  
		  
		  if (typeof event.pageX != "undefined" && typeof event.x != "undefined")  
		  {  
		    cursorPosition[0] = event.pageX;  
		    cursorPosition[1] = event.pageY;  
		  }  
		  else  
		  {  
		    cursorPosition[0] = event.clientX + scrollingPosition[0];  
		    cursorPosition[1] = event.clientY + scrollingPosition[1];  
		  }  
		  
		  return  cursorPosition;
		}  
		// 获取当前滚动位置
		function getScrollingPosition(){  
		    var position = [0, 0];  
		    //FF  
		    if (typeof window.pageYOffset != 'undefined'){  
		        position = [  
		            window.pageXOffset,  
		            window.pageYOffset  
		        ];  
		    }  
		    //IE  
		    else if (typeof document.documentElement.scrollTop  
		        != 'undefined' && document.documentElement.scrollTop > 0 ||  
		        document.documentElement.scrollLeft > 0)  
		    {  
		        position = [  
		            document.documentElement.scrollLeft,  
		            document.documentElement.scrollTop  
		        ];  
		    }  
		    else if (typeof document.body.scrollTop != 'undefined')  
		    {  
		        position = [  
		            document.body.scrollLeft,  
		            document.body.scrollTop  
		        ];  
		    }  
		    return position;  
		}


例如:

function clickDiv(event){
			var cursorPosition = displayCursorPosition(event);
			pageX=cursorPosition[0];
			pageY=cursorPosition[1];
			// 整个页面(滚动条)的坐标位置
			//alert(pageX+"-"+pageY);
			// 客户区的坐标位置
			//alert(event.clientX+"-"+event.clientY);
			// 如果 鼠标点击位置大于客户区620
			if(event.clientX >= 620){
				pageX = pageX - parseInt($("#divInfo").css("width"))-5;
			}
			// 如果 div的高度将会大于客户区的高度
			if((event.clientY+parseInt($("#divInfo").css("height")))>=800){
				pageY = pageY - parseInt($("#divInfo").css("height"))-30;
			}
			// 设置div出现的位置是:鼠标单击的整个页面内的绝对位置
			$("#divInfo").css('position','absolute');
			$("#divInfo").css('left',pageX+"px");
			$("#divInfo").css('top',pageY+"px");
			$("#divInfo").show();
		}








  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值