`

巧用定时器,实现鼠标事件中层的显示与隐藏

    博客分类:
  • JS
阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">" target="_blank">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"></a>
<html xmlns="<a href="http://www.w3.org/1999/xhtml">" target="_blank">http://www.w3.org/1999/xhtml"></a>
<head>
    <title></title>
    <script type="text/javascript">
        window.onload = function ()
        {
            var oDiv1 = document.getElementById('div1');
            var oDiv2 = document.getElementById('div2');
            var timer = null;//定义定时器变量
            //鼠标移入div1或div2都把定时器关闭了,不让他消失
            oDiv1.onmouseover = oDiv2.onmouseover = function ()
            {
                oDiv2.style.display = 'block';
                clearTimeout(timer);
            }
            //鼠标移出div1或div2都重新开定时器,让他延时消失
            oDiv1.onmouseout = oDiv2.onmouseout = function ()
            {
                //开定时器
                timer = setTimeout(function () {
                    oDiv2.style.display = 'none'; }, 500);
            }
        }
    </script>
    <style>
        #div1
        {
            width: 50px;
            height: 50px;
            background: red;
            float: left;
            margin-right: 20px;
        }
        #div2
        {
            width: 200px;
            height: 200px;
            background: yellow;
            float: left;
            display: none;
        }
    </style>
</head>
<body>
    <div>
        <div id="div1">这是第一个层
        </div>
        <div id="div2">这是第二个层
        </div>
    </div>
</body>
</html>
转自:http://zhidao.baidu.com/link?url=XoK3vVmvSnBWbxnK4cveE1idZIB1pcfR2r4OO4orcgrlTIU01i0kwu3E18yAzEeFS3G_1wzPPO1WQ_-MaKU8B_GYhM6lbR5qSOebjfJImiW
分享到:
评论

相关推荐

    一个定时器实现多个虚拟定时器具体代码实现

    6. **并发与同步**:在多线程环境下,虚拟定时器的实现需要考虑线程安全问题,可能需要使用锁或其他同步机制来防止数据竞争。 7. **可扩展性与灵活性**:好的虚拟定时器设计应该允许添加新功能,如暂停、恢复、取消...

    LabWindows/CVI的鼠标-键盘-定时器-滚动条-事件响应

    例如,可以使用鼠标和键盘事件收集用户输入,通过定时器进行后台处理,而滚动条则可以用来控制数据的显示或参数设置。在"例程1:鼠标-键盘-定时器-滚动条-事件响应"的示例中,可能包含了一个完整的程序,演示了如何...

    51单片机Proteus仿真实例 定时器控制数码管动态显示 (2)

    51单片机Proteus仿真实例 定时器控制数码管动态显示 (2)51单片机Proteus仿真实例 定时器控制数码管动态显示 (2)51单片机Proteus仿真实例 定时器控制数码管动态显示 (2)51单片机Proteus仿真实例 定时器控制数码管动态...

    Qt实现窗体在显示屏旁边自动隐藏/显示

    在实际开发中,可以使用Qt Designer创建UI布局,然后用`uic`命令生成对应的`.cpp`和`.h`文件,再在代码中实现上述逻辑。 总的来说,这个项目涉及了Qt窗体的事件处理、自定义行为以及屏幕信息的获取,对于提高Qt编程...

    定时器控制数码管动管显示.zip

    【标题】"定时器控制数码管动管显示.zip"是一个包含资源的压缩包,主要涉及的是使用定时器来实现数码管动态显示的技术。在嵌入式系统或微控制器编程中,数码管动态显示是一种常见的显示方式,它通过快速切换数码管的...

    最新单片机仿真 用定时器T0的中断实现长时间定时

    最新单片机仿真 用定时器T0的中断实现长时间定时最新单片机仿真 用定时器T0的中断实现长时间定时最新单片机仿真 用定时器T0的中断实现长时间定时最新单片机仿真 用定时器T0的中断实现长时间定时最新单片机仿真 用...

    VC++高效定时器实现

    在Windows系统中,我们可以使用QueryPerformanceCounter和QueryPerformanceFrequency函数来获取系统计时器的当前值和频率,从而实现微秒甚至纳秒级别的定时精度。 要实现一个高效的VC++定时器,我们需要以下步骤: ...

    使用定时器和事件过滤器实现的欢迎页面

    在本文中,我们将深入探讨如何使用Qt库中的定时器(Timers)和事件过滤器(Event Filters)来创建一个欢迎页面。Qt是一个跨平台的应用程序开发框架,广泛应用于桌面、移动和嵌入式系统,提供了丰富的图形用户界面...

    单片机C语言程序设计 定时器控制数码管动管显示(有源码)

    单片机C语言程序设计 定时器控制数码管动管显示(有源码)单片机C语言程序设计 定时器控制数码管动管显示(有源码)单片机C语言程序设计 定时器控制数码管动管显示(有源码)单片机C语言程序设计 定时器控制数码管动管...

    C++定时器实现

    总的来说,C++中的定时器实现可以根据需求选择不同的方法,从简单的基于线程和条件变量的实现到使用高级库如Boost.Asio。理解这些机制可以帮助我们更好地控制程序的时间行为,从而提高软件的效率和可靠性。在实际...

    仿QQ屏幕右上角鼠标移动显示离开隐藏效果

    通过比较鼠标位置与窗体边界之间的距离,我们可以判断是否需要显示隐藏的元素。例如,如果鼠标距离窗体右上角的像素小于预设阈值,就显示该效果;反之,则隐藏。 接下来,我们需要设计一个自定义控件或用户控件...

    51单片机实现 定时器计数 数码管显示0到99.rar

    在这个项目中,我们假设使用动态显示技术,通过8个IO口控制两个数码管的8个段,以实现0到99的显示。 实现数码管动态显示的关键步骤包括: 1. 初始化定时器T0:设置工作模式为计数模式,选择合适的计数初值,以便...

    VC 实现非窗口类中使用定时器的方法

    对于非窗口类使用定时器,我们需要依赖系统级定时器,因为窗口消息定时器需要与窗口句柄关联。我们可以使用SetTimer API函数创建一个系统定时器,该函数需要四个参数:定时器ID、间隔时间(毫秒)、回调函数指针以及...

    实现单片机 基于定时器的电子钟(C语言)

    4. 显示驱动:单片机需要与显示屏通信,这可能涉及到串行或并行接口,以及特定的显示驱动程序。根据实际硬件,可能需要控制数码管或者液晶屏显示时间。 5. 锁存和更新:为了确保在中断服务过程中不干扰正常的时间...

    C++自定义定时器实现(多对象多定时器)

    在C++编程中,实现自定义定时器可以涉及到多线程、信号处理、时间轮或者事件循环等技术。下面将详细讨论如何在C++中实现一个多对象多定时器的功能。 首先,我们需要理解定时器的基本原理。定时器通常由一个计时器...

    2.23 Qt day4 事件机制+定时器事件+键盘事件+鼠标事件

    2.23 Qt day4 事件机制+定时器事件+键盘事件+鼠标事件

    定时器时钟显示时分秒

    在这个项目中,“定时器时钟显示时分秒”是一个利用51单片机的定时器功能来实现时钟显示的实例。定时器在51单片机中扮演着至关重要的角色,它能执行周期性的任务,如计数、延时和中断服务。接下来,我们将深入探讨51...

    51单片机用定时器实现10s的计数

    ### 51单片机用定时器实现10秒计数 #### 一、基础知识介绍 在本篇文章中,我们将探讨如何使用51单片机的定时器来实现10秒的计数功能。该应用涉及到的主要技术点包括:定时器的工作原理、定时器中断的应用以及...

    使用Timer插件 实现鼠标坐标显示

    在C# Winform应用程序中,实现鼠标坐标的动态显示,我们可以利用Timer控件来定期获取鼠标的位置信息,并将其更新到界面上。Timer插件在Windows Forms应用程序中是一种非常实用的工具,它可以在指定的时间间隔内触发...

    C#多线程实现定时器

    在C#中,可以使用System.Windows.Forms.Timer控件来实现定时器功能,但是这里介绍的是使用多线程技术来实现定时器。 实现原理: 首先,定义两个类:timer类和interval_date类。timer类用于管理和配置定时器,而...

Global site tag (gtag.js) - Google Analytics