鼠标移动太快，mouseout事件不触发解决方案

最新推荐文章于 2024-12-13 16:38:32 发布

米娜Rose

最新推荐文章于 2024-12-13 16:38:32 发布

阅读量8.6k

点赞数

CC 4.0 BY-SA版权

分类专栏： div+css Javascript 文章标签： function div border xhtml html

本文链接：https://blog.youkuaiyun.com/adengliuqing/article/details/7682570

Javascript 同时被 2 个专栏收录

12 篇文章

订阅专栏

div+css

6 篇文章

订阅专栏

本文介绍了一个简单的网页设计案例，通过HTML与JavaScript实现鼠标悬停时显示隐藏层的效果。该案例展示了如何使用HTML来构建页面结构，并利用JavaScript来控制元素的显示与隐藏状态，实现了良好的交互体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">

        function over()
        { document.getElementById("div1").style.display = "";}
        function out()
        { document.getElementById("div1").style.display = "none"; }
        function out1(ev)
        { ev = ev || window.event; var obj = ev.toElement || ev.relatedTarget;if (obj.id != "div1") out(); }
    </script>
</head>
<body>
    <a href="#" onmouseover="over()" onmouseout="out1(event)" style=" border:solid 1px red;">
        111111111111111111111111111111111111</a>
    <div id="div1" onmouseout="out()" style="height: 300px; width: 300px; border: solid 1px red; display: none;">
    </div>
</body>
</html>