脑子不好用了，一点东西要看几遍才能记住，学过的东西也要好几遍，悲哀。

习惯了jquery的hover，或者看过hover源码，或者是正美的《框架设计》，onmouseover和onmouseout的bug问题，不过对于我等脑子不好用的，还是几个无bug的问题吧，看代码

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<style>

#div1{

  width: 200px;

  height: 200px;

  background: #ccc;

  overflow: hidden;

}

h2{

  width: %;

  height: 30px;

  background: red;

}

</style>

<script type="text/javascript">

window.onload=function(){

  var oDiv = document.getElementById('div1');

/*  oDiv.onmouseover=function(ev){

    var oEvent = ev || event;

    var oFrom = oEvent.fromElement || oEvent.relatedTarget;

    if(oDiv.contains(oFrom)){

     return ;

    }

    alert('移入')

  }*/

  /*oDiv.onmouseenter=function(){

    alert('移入')

  }*/

  oDiv.onmouseout=function(ev){

    var oEvent = ev || event;

    var oTo = oEvent.toElement || oEvent.relatedTarget;

    if(oDiv.contains(oTo)){

      return false;

    }

    alert('移出')

  }

  /*oDiv.onmouseleave=function(){

    alert('移出')

  }*/

}

</script>

</head>

<body>

<div id="div1">

<h2>我是h2</h2>

</div>

</body>

</html>

通过判断事件对象中fromElement|| relatedTarget,判断鼠标来源方向deng

onmouseover和onmouseout的bug的更多相关文章

  1. 关于onmouseover和onmouseout的bug

    总结了一下关于使用onmouseover以及onmouseout会出现的bug 首先简单的布局: <div id="box"> <div>这是一个内容< ...

  2. onmouseover和onmouseout的那些事

    这篇文章来自一个偶然...以前刚开始学习javascript事件的时候就被一个东西搞得晕头撞向的.就是一对名字很相近的事件.一组是onmouseover()和onmouseout().另一组就是onm ...

  3. JQuery 之事件中的 ----- hover 与 onmouseover 、onmouseout 联系

    hover([over,]out) 一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法.这是一个自定义的方法,它为频繁使用的任务提供了一种“保持在其中”的状态. 当鼠标移动到一个匹配的元素 ...

  4. onmouseover和onmouseout的烦恼

    一个DIV层,当鼠标移进的时候会触发onmouseover,移出的时候会触发onmouseout.   非常easy的逻辑,这也是我们想要的!但随之烦恼也就来了:onmouseover并不会仅仅在移进 ...

  5. 使用HTML DOM 来分配事件 —— onmouseover和onmouseout ，onmousedown和onmouseup

    一, onmouseover 和 onmouseout 事件 onmouseover 和 onmouseout 事件可用于在用户的鼠标移至 HTML 元素上方或移出元素时触发函数. 一个小例:鼠标未在 ...

  6. JS:onmouseover 、onmouseout

    鼠标移动到P标签上时,改变文本和边框样式 <style type="text/css"> .onmouseover { color: red; border: 1px ...

  7. 【try..catch..】【判断输入是否为空】【onchange事件】【onmouseover和onmouseout事件】【onmousedown和onmouseup事件】

    1.try..catch.. <body><script>function myFunction(){try{ var x=document.getElementById(&q ...

  8. Repeater控件添加onmouseover和onmouseout事件

    网友有问题,在Repeater控件中,需要添加onmouseover和onmouseout事件功能.Insus.NET有叫他参考<onmouseover和onmouseout在Repeater控 ...

  9. HTML事件(onclick、onmouseover、onmouseout、this)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. TensorFlow 之 手写数字识别MNIST

    官方文档: MNIST For ML Beginners - https://www.tensorflow.org/get_started/mnist/beginners Deep MNIST for ...

  2. bzoj 3505 数三角形 - 组合数学

    给定一个nxm的网格,请计算三点都在格点上的三角形共有多少个.下图为4x4的网格上的一个三角形. 注意三角形的三点不能共线. Input 输入一行,包含两个空格分隔的正整数m和n. Output 输出 ...

  3. [noip模拟题]合理种植

    [问题描述] 大COS在氯铯石料场干了半年,受尽了劳苦,终于决定辞职.他来到表弟小cos的寒树中学,找到方克顺校长,希望寻个活干. 于是他如愿以偿接到了一个任务…… 美丽寒树中学种有许多寒树.方克顺希 ...

  4. 网络安全、Web安全、渗透测试之笔经面经总结（三）

    本篇文章涉及的知识点有如下几方面: 1.什么是WebShell? 2.什么是网络钓鱼? 3.你获取网络安全知识途径有哪些? 4.什么是CC攻击? 5.Web服务器被入侵后,怎样进行排查? 6.dll文 ...

  5. 64bit ubuntu如何使能安装32bit软件

    答:使用一下命令即可: sudo dpkg --add-architecture i386

  6. gvim写html代码时如何快速地跳转到一个标签的结束位置: 终极插件: matchit.vim

    gvim写html代码时如何快速地跳转到一个标签的结束位置 参考这个vimrc的配置, 里面有一些 很好的东西, 配置很有用, 以前没有用到: http://www.cnblogs.com/wangj ...

  7. 【文件readonly异常】异常退出编译文件，再次进入提示readonly

    1.对于同一个文件如果上次已经打开,而未关闭的情况下,又打开该文件进行编辑时,会出现如下提醒: 这是由于已经打开但未闭关的文件,会在其目录下出现一个.swp的文件,由于是属于隐藏文件,可以用命令l.  ...

  8. [BZOJ1776][Usaco2010 Hol]cowpol 奶牛政坛

    Description 农夫约翰的奶牛住在N (2 <= N <= 200,000)片不同的草地上,标号为1到N.恰好有N-1条单位长度的双向道路,用各种各样的方法连接这些草地.而且从每片 ...

  9. js中一些关于比较左右两边的值的题目

    alert(typeof(NaN)); alert(typeof(Infinity)); alert(typeof(null)); alert(typeof(undefined)); alert(Na ...

  10. 01_Kafka概述

    1.Kafka背景 * LinkedIn开发,2011年成为Apache的一个开源项目* 2012年,成为Apache的一个顶级项目* 基于java和Scala编写, 基于发布-订阅模型的消息系统(离 ...