判断鼠标从哪个方向进入--jQuery
转载自:http://sentsin.com/web/112.html
$("#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; //direction的值为“0,1,2,3”分别对应着“上,右,下,左”
var eventType = e.type;
var dirName = new Array('上方','右侧','下方','左侧');
if(e.type == 'mouseenter'){
$("#result").html(dirName[direction]+'进入');
}else{
$('#result').html(dirName[direction]+'离开');
}
});
很实用的一段代码
判断鼠标从哪个方向进入--jQuery的更多相关文章
- JS判断鼠标从什么方向进入一个容器
偶然将想到的一个如何判断鼠标从哪个方向进入一个容器的问题.首先想到的是给容器的四个边添加几个块,然后看鼠标进入的时候哪个块先监听到鼠标事件.不过这样麻烦太多了.google了一下找到了一个不错的解决方 ...
- JS判断鼠标进入容器方向的方法和分析window.open新窗口被拦截的问题
1.鼠标进入容器方向的判定 判断鼠标从哪个方向进入元素容器是一个经常碰到的问题,如何来判断呢?首先想到的是:获取鼠标的位置,然后经过一大堆的if..else逻辑来确定.这样的做法比较繁琐,下面介绍两种 ...
- js判断鼠标滑轮滚动方向并根据滚动的方向触发不同的事件
<script> var scrollFunc = function (e) { var direct = 0; e = e || window.event; if (e.wheelDel ...
- JS判断鼠标从哪个方向进入DIV容器
写的不够高大上 , 不要介意哦... Js: //进去 $(".flash").bind("mouseenter",function(e){ /** the w ...
- jQuery插件,判断鼠标的移入移出方向
今天用jQuery封装了一个简单的插件,判断鼠标的移入移出方向,以后的项目中可能还会遇到这样一个简单的效果,就记录下来吧! 先看结构和样式: <!DOCTYPE html> <htm ...
- js中判断鼠标滚轮方向的方法
前 言 LiuDaP 最近无聊,在做自己的个人站,其中用到了一个关于鼠标滚轮方向判断的方法,今天闲来无聊,就给大家介绍一下吧!!!! 在介绍鼠标事件案例前,让我们先稍微了解一下js中的event ...
- JS实现穿墙效果(判断鼠标划入划出的方向)
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- 关于js判断鼠标移入元素的方向--解释
一开始我是这么想的,将待移入的元素分割四块,用mousemove获取第一次鼠标落入的区域来判断鼠标是从哪个方向进去的. 所以只要写个算法来判断鼠标的值落入该元素的区域就可以得出鼠标移入的方向,如下图: ...
- 关于js判断鼠标移入元素的方向——上下左右
一开始我是这么想的,将待移入的元素分割四块,用mousemove获取第一次鼠标落入的区域来判断鼠标是从哪个方向进去的. 所以只要写个算法来判断鼠标的值落入该元素的区域就可以得出鼠标移入的方向,如下图: ...
随机推荐
- 带你一分钟理解 JavaScript 闭包
什么是闭包? 先看一段代码: function a(){ var n = 0; function inc() { n++; console.log(n); } inc(); inc(); } a(); ...
- Power Strings - POJ 2406(求循环节)
题目大意:叙述的比较高大上,其实就是一个字符串B = AAAAAAA,求出来这个A最短有多长 分析:注意如果这个串不是完全循环的,那么循环节就是就是它本身. 代码如下: #include< ...
- php如何同时连接多个数据库
下面是一个函数能够保证连接多个数据库的下不同的表的函数,可以收藏一下,比较实用,测试过是有用的. function mysql_oper($oper,$db,$table,$where='1',$li ...
- Java学习的随笔(一)对象概念、this指针、权限修饰符
最近在看<Java编程思想>,下面按照最近看书的顺序梳理一下心得,由于是初次学习,大部分心得是摘抄自书中: 1. Java中,每个变量都是一个对象. 在创建时首先在内存的堆栈中创建一个该对 ...
- Textview 文本旋转,倾斜
有时候Android自带的控件无法满足我们的某些要求,这时就需要我们自定义控件来实现这些功能.比如需要一个TextView里的字倾斜一定的角度,就需要自定义TextView. 代码如下: ? 1 2 ...
- floyd+动态规划 hdu-4571-Travel in time
题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=4571 题目大意: 有n个景点,每个点都有个游玩时间ci,游玩后得到的满意度si.给一个起点s和终点e ...
- [Javascript] Automating Releases with semantic-release
There are so many repeated steps when releasing a new version of a library. The tool semantic-releas ...
- Android技术精髓-Bitmap详解
Bitmap (android.graphics.Bitmap) Bitmap是Android系统中的图像处理的最重要类之一.用它可以获取图像文件信息,进行图像剪切.旋转.缩放等操作,并可以指定格式保 ...
- java多态---内存关系
在该列中,a.lookDoor()会报错,因为azhong没有lookDoor这个方法,同理,a.playGame()也会报错. 注意!!! 最后一句Dog dd=(Dog)a: 这句话非常错误! 在 ...
- Python之路,Day8 - Socket编程进阶
Python之路,Day8 - Socket编程进阶 本节内容: Socket语法及相关 SocketServer实现多并发 Socket语法及相关 socket概念 socket本质上就是在2台 ...