js 判断鼠标进去方向
function fx(id){
var obj= document.getElementById(id);
var fun=function(e){
var w=obj.offsetWidth;
var h=obj.offsetHeight;
var y=e.clientY;
var x=e.clientX;
var yz=(y-obj.offsetLeft-(h/2))*(h>w?(w/h):1);
var xz=(x-obj.offsetTop-(w/2))*(w>h?(h/w):1);
var direction = Math.round((((Math.atan2(yz, xz) * (180 / Math.PI)) + 180) / 90) + 3) % 4;
//var fangxiang=new Array("上边","右边","下边","左边");
switch(direction){
case 0:obj.style.background="red"
break;
case 1:obj.style.background="blue"
break;
case 2:obj.style.background="#ff0"
break;
case 3:obj.style.background="#2f0"
break;
}
}
if(window.attachEvent){
obj.attachEvent("click",fun);
obj.attachEvent("mouseover",fun);else{obj.addEventListener("click",fun,false);
obj.addEventListener("mouseover",fun,false);
}
}
fx("box");
js 判断鼠标进去方向的更多相关文章
- js 判断鼠标滚轮方向
最近因为公司项目的要求,需要做页面的全屏滚动切换效果. 页面的切换,需要脚本监听鼠标滑轮的滚动事件,来判断页面是向上切换or向下切换. 这里的脚本很简单,我就直接贴出来吧. $('html').on( ...
- js/jq判断鼠标滚轮方向
js判断鼠标滚轮方向: var scrollFunc = function (e) { e = e || window.event; if (e.wheelDelta) { //判断浏览器IE,谷歌滑 ...
- JS判断鼠标从什么方向进入一个容器
偶然将想到的一个如何判断鼠标从哪个方向进入一个容器的问题.首先想到的是给容器的四个边添加几个块,然后看鼠标进入的时候哪个块先监听到鼠标事件.不过这样麻烦太多了.google了一下找到了一个不错的解决方 ...
- js中判断鼠标滚轮方向的方法
前 言 LiuDaP 最近无聊,在做自己的个人站,其中用到了一个关于鼠标滚轮方向判断的方法,今天闲来无聊,就给大家介绍一下吧!!!! 在介绍鼠标事件案例前,让我们先稍微了解一下js中的event ...
- JS 判断鼠标滚轮的上下滚动
JS 判断鼠标滚轮的上下滚动 <script type="text/javascript"> var scrollFunc = function (e) { e = ...
- JS判断鼠标进入容器方向的方法和分析window.open新窗口被拦截的问题
1.鼠标进入容器方向的判定 判断鼠标从哪个方向进入元素容器是一个经常碰到的问题,如何来判断呢?首先想到的是:获取鼠标的位置,然后经过一大堆的if..else逻辑来确定.这样的做法比较繁琐,下面介绍两种 ...
- JS判断鼠标移入元素的方向
最终效果 这里的关键主要是判断鼠标是从哪个方向进入和离开的 $("li").on("mouseenter mouseleave",function(e) { v ...
- JS用斜率判断鼠标进入DIV四个方向的方法 判断鼠标移入方向
本文要介绍的是一种鼠标从一个元素移入移出时,获取鼠标移动方向的思路.这个方法可以帮助你判断鼠标在移入移出时,是从上下左右的哪个方向发生的.这个思路,是我自己琢磨出来,利用了一点曾经高中学过的数学知识, ...
- 2015.10.11(js判断鼠标进入容器的方向)
判断鼠标进入容器的方向 1.前几天在万圣节专题项目中用到了鼠标坐标page事件,随着鼠标背景图片移动形成有层次感的效果,但page事件在IE低版本不支持,所以还要做兼容.在研究page事件同时无意中想 ...
随机推荐
- glade2支持C++代码的输出(3)
今天完成了glade-2生成configure.ac/Makefile.am等调整 代码为:cpp_out_4.patch.zip BaseObject类也做了一些小的调整:BaseObject.00 ...
- 如果将CTE 用在属于批处理的一部分的语句中
declare @s nvarchar(3) set @s = 'C%' ; -- 必须加分号with t_tree as ( select CountryRegionCode from person ...
- php5.1以上版本时间戳_时间戳与日期格式转换_相差8小时 的解决方案
php5.1以上时间戳会与实际时间相差8小时,解决办法如下 .最简单的方法就是不要用php5.1以上的版本--显然这是不可取的方法!!! .修改php.ini.打开php.ini查找date.time ...
- js操作DOM动态添加和移除事件
非IE下,注意事件名不带on,如onclick为click 添加事件:DOM对象.addEventListener('事件名',函数名,true/false); 删除事件:DOM对象.removeEv ...
- JavaScript学习笔记——对象分类
对象的分类 一.对象的分类 1.内置对象 Global Math 2.本地对象 Array Number String Boolean Function RegExp 3.宿主对象 DOM BOM 二 ...
- js数组操作【转载】
用 js有很久了,但都没有深究过js的数组形式.偶尔用用也就是简单的string.split(char).这段时间做的一个项目,用到数组的地方很多,自以为js高手的自己居然无从下手,一下狠心,我学!呵 ...
- Productivity Power Tools 是微软官方推出的 Visual Studio 扩展
Productivity Power Tools 是微软官方推出的 Visual Studio 扩展 免费的精品: Productivity Power Tools 动画演示
- 居于Web的进度条实现思路(下载百分比)
http://www.cnblogs.com/wfyfngu/p/4866434.html 在传统桌面项目中,进度条随处可见,但作为一个很好的用户体验,却没有在如今主流的B/S程序中得到传承,不能不说 ...
- ] 解决myeclipse中新建javaweb工程,无法使用Web App Libraries问题
] 解决myeclipse中新建javaweb工程,无法使用Web App Libraries问题 标签: myeclipsejavawebWeb App Libraries 2013-10-16 1 ...
- 用实例揭示notify()和notifyAll()的本质区别
用实例揭示notify()和notifyAll()的本质区别 收藏 notify()和notifyAll()都是Object对象用于通知处在等待该对象的线程的方法.两者的最大区别在于: notif ...