首页 > 代码库 > 判断鼠标从哪个方向进入容器
判断鼠标从哪个方向进入容器
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>判断鼠标进入方向</title></head><body><style>html,body{margin:0;padding:0;}#wrap{width:300px;height:300px;background:#33aa00;margin:50px;display:inline-block;font-size:50px;text-align:center;line-height:300px;}</style><div id="wrap"> 方向反馈</div><script type="text/javascript" src="http://common.cnblogs.com/script/jquery.js"></script><script>$("#wrap").bind("mouseenter mouseleave",function(e) { var w = $(this).width(); var h = $(this).height(); var x = (e.pageX - this.offsetLeft - (w / 2)) * (w > h ? (h / w) : 1); var y = (e.pageY - this.offsetTop - (h / 2)) * (h > w ? (w / h) : 1); var direction = Math.round((((Math.atan2(y, x) * (180 / Math.PI)) + 180) / 90) + 3) % 4; console.log("方向是:"+direction); //输出方向 0 1 2 3 var eventType = e.type; var dirName = new Array(‘上方‘,‘右侧‘,‘下方‘,‘左侧‘); if(e.type == ‘mouseenter‘){ $(this).html(dirName[direction]+‘进入‘); }else{ $(this).html(dirName[direction]+‘离开‘); }});</script></body></html>
判断鼠标从哪个方向进入容器
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。