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 判断鼠标进去方向的更多相关文章

  1. js 判断鼠标滚轮方向

    最近因为公司项目的要求,需要做页面的全屏滚动切换效果. 页面的切换,需要脚本监听鼠标滑轮的滚动事件,来判断页面是向上切换or向下切换. 这里的脚本很简单,我就直接贴出来吧. $('html').on( ...

  2. js/jq判断鼠标滚轮方向

    js判断鼠标滚轮方向: var scrollFunc = function (e) { e = e || window.event; if (e.wheelDelta) { //判断浏览器IE,谷歌滑 ...

  3. JS判断鼠标从什么方向进入一个容器

    偶然将想到的一个如何判断鼠标从哪个方向进入一个容器的问题.首先想到的是给容器的四个边添加几个块,然后看鼠标进入的时候哪个块先监听到鼠标事件.不过这样麻烦太多了.google了一下找到了一个不错的解决方 ...

  4. js中判断鼠标滚轮方向的方法

      前  言 LiuDaP 最近无聊,在做自己的个人站,其中用到了一个关于鼠标滚轮方向判断的方法,今天闲来无聊,就给大家介绍一下吧!!!! 在介绍鼠标事件案例前,让我们先稍微了解一下js中的event ...

  5. JS 判断鼠标滚轮的上下滚动

    JS 判断鼠标滚轮的上下滚动   <script type="text/javascript"> var scrollFunc = function (e) { e = ...

  6. JS判断鼠标进入容器方向的方法和分析window.open新窗口被拦截的问题

    1.鼠标进入容器方向的判定 判断鼠标从哪个方向进入元素容器是一个经常碰到的问题,如何来判断呢?首先想到的是:获取鼠标的位置,然后经过一大堆的if..else逻辑来确定.这样的做法比较繁琐,下面介绍两种 ...

  7. JS判断鼠标移入元素的方向

    最终效果 这里的关键主要是判断鼠标是从哪个方向进入和离开的 $("li").on("mouseenter mouseleave",function(e) { v ...

  8. JS用斜率判断鼠标进入DIV四个方向的方法 判断鼠标移入方向

    本文要介绍的是一种鼠标从一个元素移入移出时,获取鼠标移动方向的思路.这个方法可以帮助你判断鼠标在移入移出时,是从上下左右的哪个方向发生的.这个思路,是我自己琢磨出来,利用了一点曾经高中学过的数学知识, ...

  9. 2015.10.11(js判断鼠标进入容器的方向)

    判断鼠标进入容器的方向 1.前几天在万圣节专题项目中用到了鼠标坐标page事件,随着鼠标背景图片移动形成有层次感的效果,但page事件在IE低版本不支持,所以还要做兼容.在研究page事件同时无意中想 ...

随机推荐

  1. python学习笔记-(三)条件判断和循环

    1.条件判断语句 Python中条件选择语句的关键字为:if .elif .else这三个.其基本形式如下: age_of_cc = 27 age = int(input("guessage ...

  2. ajax返回数据类型为XML数据的处理

    /*XML:可扩展标记语言 HTML:超文本标记语言 标签:<标签名></标签名> 特点: 1.必须要有一个根 2.标签名自定义 3.对大小写敏感 4.有开始就要有结束 5.同 ...

  3. Docker Dockerfile COPY vs ADD

    http://blog.163.com/digoal@126/blog/static/163877040201410341236664/   在Dockerfile中, 我们可以使用ADD和COPY拷 ...

  4. yum -y install与yum install有什么不同

    yum -y install 包名(支持*) :自动选择y,全自动 yum install 包名(支持*) :手动选择y or n yum remove 包名(不支持*) rpm -ivh 包名(支持 ...

  5. CSS 改变文本选中颜色

    改变文字颜色 ::selection {    background: #f88;    text-shadow: none;    color: #000;}::-moz-selection {  ...

  6. 调整Linux磁盘分区的大小的方法

      昨天数据入库时,一直报错,说磁盘满了,,df -h    一看,发现/目录下只有50G空间,已使用49G:我的程序和dbss都安装在/目录下,ftp到的数据放在/data下的一个子目录下,分解完的 ...

  7. mapreduce 模板

    /*** * MapReduce Module * @author nele * */ public class ModuleMapReduce extends Configured implemen ...

  8. sql sever 字符串函数

    SQL Server之字符串函数   以下所有例子均Studnet表为例:  计算字符串长度len()用来计算字符串的长度 select sname ,len(sname) from student ...

  9. C# DateTime和String转换

    "; DateTime.ParseExact(time,"yyyyMMdd",System.Globalization.DateTimeFormatInfo.Curren ...

  10. solr多条件查询(一)

    每个项目的数据结构可能不同,查询的格式有可能不同,本项目所有的字段为动态的,所以整理了一下, 1.查询所有字段中包含”测试“但是所有的TM不包含”江苏大学“ q:X_1457955996315KEY: ...