<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

    <style >

        #div1{width: 400px;height: 40px;background-color: red;}

        #div2{width: 250px;height: 30px;background-color: blue;margin: 10px;display: none;}

    </style>

    <script>

        window.onload=function (){

            var oDiv1=document.getElementById("div1");

            var oDiv2=document.getElementById("div2");

            var timer=null;

            oDiv1.onmouseover=oDiv2.onmouseover=function (){

                oDiv2.style.display="block";

                clearInterval(timer);

            };

            oDiv2.onmouseout=oDiv1.onmouseout=function(){

                timer=setTimeout(function (){

                    oDiv2.style.display='none';

                }, 300);

            }

        }

    </script>

</head>

<body>

<div id="div1"></div>

<div id="div2"></div>

</body>

</html>

             

鼠标移入 移出div div会消失的处理的更多相关文章

  1. div展现与收起效果（鼠标移入移出）

    效果图: 移入: 移出: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  2. 函数传参，改变Div任意属性的值&&图片列表：鼠标移入/移出改变图片透明度

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. CSS3鼠标移入移出图片生成随机动画

    今天分享使用html+css3+少量jquery实现鼠标移入移出图片生成随机动画,我们先看最终效果图(截图为静态效果,做出来可是动态的哟) 左右旋转 上下移动 缩放 由于时间关系我就不一步步解析各段代 ...

  4. js鼠标移入移出事件会被子元素触发解决方法

    问题:js写了一个鼠标移入移出事件,但是发现会被内部子元素不断的触发 解决方法:建立一个空的div定位到需要触发的位置,然后设置大小和触发范围一样,最后将事件写在空的div上.

  5. Vue 鼠标移入移出事件

    Vue 中鼠标移入移出事件 @mouseover和@mouseleave 然后绑定style   现在开始代码示例 <template> <div class="pc&qu ...

  6. js鼠标移入移出效果【原】

    <HTML> <HEAD> <!-- meta 解释 : http://www.haorooms.com/post/html_meta_ds --> <met ...

  7. jquery事件一 ---鼠标移入移出

    比较一下几个jquery事件的区别 mouseover() 鼠标进入(进入子元素也触发) mouseout() 鼠标离开(离开子元素也触发) mouseenter() 鼠标进入(进入子元素不触发) m ...

  8. Vue中通过鼠标移入移出来添加或取消class样式（active）

     基础知识: 先写一下vue中鼠标移入移出的基础知识,移入的触发事件是 @mouseenter,移出的触发事件是@mouseleave,知道这两个方法就简单了 基础知识的例子 <div clas ...

  9. onmouseover和onmouseout鼠标移入移出切换图片的几种实现方法

    鼠标移入移出图片切换很常见的,那我们就来说说他的写法 第一种方法,也是最简单的一种,在html:里就可实现 <img class="img" src="img/do ...

  10. js(jquery)鼠标移入移出事件时，出现闪烁、隐藏显示隐藏显示不停切换的情况

    <script> $(".guanzhu").hover(function(){ $(".weixinTop").show(); },functio ...

随机推荐

  1. while +next 循环 回到循环顶端

    my $show_tip = 1; sub login { while (1) { my $api ="https://login.weixin.qq.com/cgi-bin/mmwebwx ...

  2. java提高篇(十)-----详解匿名内部类 ,形参为什么要用final

    在java提高篇-----详解内部类中对匿名内部类做了一个简单的介绍,但是内部类还存在很多其他细节问题,所以就衍生出这篇博客.在这篇博客中你可以了解到匿名内部类的使用.匿名内部类要注意的事项.如何初始 ...

  3. 【HDOJ】1180 诡异的楼梯

    bfs+优先队列.wa了N次,才发现可以停留等待楼梯变换方向. #include <iostream> #include <queue> #include <cstdio ...

  4. USACO3.34Home on the Range（DP）

    之前做过一道类似的 国际象棋盘神马的.. 统计出以每个1作为右下角的最大正方形 那么以大于二到这个最大值之间为边的正方形都可以以这个为右下角 累加就可以了 dp[i][j] = min(dp[i-1] ...

  5. bat坐拥大数据。数据挖掘/大数据给他们带来什么。

    阿里巴巴CTO即阿里云负责人王坚博士说过一句话:云计算和大数据,你们都理解错了.   实际上,对于大数据究竟是什么业界并无共识.大数据并不是什么新鲜事物.信息革命带来的除了信息的更高效地生产.流通和消 ...

  6. Java学习感受

    一个暑假,两本书,让我了解到了Java的神奇美妙,这个工具的年龄跟我一样大,然而日久弥新,随着电脑技术科学家,工程师的开发,Java的功能越来越完善.学习的时间不长,但我比较着学习,把Java跟C.C ...

  7. HDU 4749 Parade Show 2013 ACM/ICPC Asia Regional Nanjing Online

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4749 题目大意:给一个原序列N,再给出一个序列M,问从N中一共可以找出多少个长度为m的序列,序列中的数 ...

  8. 3 weekend110的shuffle机制 + mr程序的组件全貌

    前面,讲到了hadoop的序列化机制,mr程序开发,自定义排序,自定义分组. 有多少个reduce的并发任务数可以控制,但有多少个map的并发任务数还没 缓存,分组,排序,转发,这些都是mr的shuf ...

  9. hdoj 2074 叠筐

    叠筐 Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submissi ...

  10. Javascript数据类型——number类型

            ECMAScript规范中使用IEEE754格式来表示整数和浮点数.支持十进制.八进制以及十六进制.有一点注意的是八进制数字在严格模式下是无效的,这可能会影响到程序的正常运行. 避免浮 ...