JavaScript鼠标悬停事件用法解析
鼠标悬停事件是当鼠标的光标与其名称表示的元素重叠时触发的事件，本篇文章我们就来详细介绍一下JavaScript中鼠标悬停事件的用法。
我们先来看一下什么是onmouseover？
鼠标悬停的活动是“事件”，而onmouseover是事件处理程序。
事件处理程序是指定事件发生时要执行的进程所必需的。
所以onmouseover是一个事件处理程序，负责当鼠标的光标悬停在某个元素上时完成的处理。
什么是onmouseleave？
除了onmouseover之外，还有onmouseleave。
顾名思义，它处理当鼠标光标离开某个元素时触发的事件。
在下面的示例中将使用这两个属性，我们来看鼠标悬停事件的使用代码
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
</head>
<body>
<div id="div1" style="width: 150px; height: 150px; padding: 10px; border: 1px solid #000000" onmouseover="over(this)" onmouseleave="leave(this)"></div>
</body>
<script>
function over(x) {
x.style.backgroundColor = "blue";
}
function leave(x) {
x.style.backgroundColor = "red";
}
</script>
</html>
在上面的代码中，我们首先使用div标签创建了一个简单的正方形。
方块的背景颜色指定为浅粉色。
然后，我们使用HTML事件属性注册事件处理程序。
如代码所示，onmouseover属性和onmouseleave属性已添加到div标记的代码中。
onmouseover属性指定了当鼠标光标在方块上时激活的over函数。
onmouseover="over(this)"
在over函数的参数中，这表明div元素本身是over函数的参数。
over函数访问div元素的style.backgroundColor属性，并将方块的背景颜色设置为蓝色。
为onmouseleave属性指定leave函数。
与over函数一样，leave函数也可以访问div元素的style.backgroundColor属性，并将方形背景颜色设置为红色。
通过这样做，原来粉红色的正方形在将光标放在正方形时变成蓝色，在从正方形移开时变成红色。
以上就是JavaScript中的鼠标悬停事件的用法详解的详细内容，更多请关注我！！！
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持小牛知识库。
-
问题内容： 有时，我可以选择使用CSS元素：悬停或JavaScript onmouseover来控制页面上html元素的外观。考虑以下情况，其中div包装了输入 我希望输入将鼠标光标悬停在div上时更改背景色。CSS方法是 JavaScript方法是 每种方法的优点和缺点是什么？CSS方法是否适用于大多数Web浏览器？JavaScript比CSS慢吗？ 问题答案： ：hover的问题是IE6仅在链
-
我有一系列使用d3创建的行。我写了一些和事件事件。 当I时，事件通过增加行的值正常工作。 但是在上，在我编写代码的地方，事件不能正常工作，将值设置为初始值。 小提琴 帮我修一下。
-
问题内容： 我正在尝试在JButton上创建自定义鼠标悬停事件。原因是我的JButton当前是图像，因此我必须删除所有边框和动画，而不能删除所有边框和动画。所以我这样做： 这非常适合仅显示图像，并且按钮实际上可以正常工作。我想知道是否有任何预建方法可以做到这一点，或者我将如何学习做自己想做的事情。 更具体地说，当我将鼠标悬停在上方时，我希望图像做的只是使其变得更大一点。 到目前为止，我已经尝试过这
-
问题内容： libgdx中是否有任何侦听器可以让我检测到鼠标悬停而不是鼠标悬停。在场景2D的按钮类中，您有2种方法isOver和isPressed，但是它们执行相同的操作…还有其他问题吗？还有另一种方法来检测鼠标悬停在actor上吗？ 问题答案： 还有的可以连接到和它提供的事件，如下面的： 该事件从根本上来说意味着鼠标开始悬停在角色上，意味着它“离开”了角色的区域。它还有一个事件，您可以使用该事件
-
我是一个用cucumber和水豚配食的新手。我需要在使用capybara将鼠标悬停在网页的某些元素上后单击显示的链接 例如att.com 1、场景悬停在个人点击att.com上 悬停在商店上方的另一个场景——捆绑包——点击热门捆绑包 如何使用水豚的悬停和点击方法实现这一点，或者是否有其他方法可以实现这一点。 尝试的选项是 但它抱怨找不到xpath
-
我有一个Angular 8应用程序，我正在使用PrimeNG 8。在我的一个组件中，我有多个手风琴，在那里我想在鼠标悬停事件上打开手风琴。请参阅此处的文档https://www.primefaces.org/primeng/#/accordion。 有谁能帮助一下如何在鼠标悬停上实现这一点。