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

习惯了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. Educational Codeforces Round 21 Problem D(Codeforces 808D)

    Vasya has an array a consisting of positive integer numbers. Vasya wants to divide this array into t ...

  2. noip 瑞士轮 - 归并

    背景 在双人对决的竞技性比赛,如乒乓球.羽毛球.国际象棋中,最常见的赛制是淘汰赛和循环赛.前者的特点是比赛场数少,每场都紧张刺激,但偶然性较高.后者的特点是较为公平,偶然性较低,但比赛过程往往十分冗长 ...

  3. Python3基础 else 循环完整结束才执行

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...

  4. Codeforces Round #527 (Div. 3)

    一场div3... 由于不计rating,所以打的比较浪,zhy直接开了个小号来掉分,于是他AK做出来了许多神仙题,但是在每一个程序里都是这么写的: 但是..sbzhy每题交了两次,第一遍都是对的,结 ...

  5. 初始 DQN 程序 所遇到的问题

    初始 DQN 程序 所遇到的问题 最近在看 DQN,但是想试试别人放出来的 code,但是发现,额,各种问题,在此记录,以备不时之需! 问题1. wangxiao@GTX980:~/Documents ...

  6. Unity3D学习笔记(六):三角函数和点乘

    三角函数: 概念:用来描述三角形中某个角和对应的三条边的比例关系. 正弦:sin<θ>(sin<theta>)=对边/斜边 余弦:cos<θ>(cos<the ...

  7. Node.js结合Selenium做Web自动化测试

    发现腾讯课堂上有个node.js结合Selenium做Web自动化测试的教学视频, 听来感觉不错,一来老师讲的还不错,二来node.js这门语言会越来越热,学会总没什么坏处,三来发现CukeTest这 ...

  8. Jmeter性能测试之一 性能测试的流程和步骤介绍

    Step1: 知道在架构上,你要做的性能测试要cover几个部分,如下图,性能测试从用户角度,PC端之后都要要考虑进行的,例如网络,app server,Database等等 N1+N2+N3+N4 ...

  9. 《剑指offer》第二十九题(顺时针打印矩阵)

    // 面试题29:顺时针打印矩阵 // 题目:输入一个矩阵,按照从外向里以顺时针的顺序依次打印出每一个数字. #include <iostream> void PrintMatrixInC ...

  10. 899F - Letters Removing

    Codeforces 899F - Letters Removing 思路:考虑一下怎么找到输入的l和r在原来串中的位置,我们想到用前缀和来找,一开始所有位置都为1,删掉后为0,那么前缀和为l的位置就 ...