我知道 onmouseover 和 onmouseout，这样当鼠标悬停在 on 上时它们可以在没有悬停时运行一个函数，但我不知道如何让它们展开。我制作了下拉框，但无法展开它们。 例如:
123 [不悬停]
123456789123 [悬停期间]
我试过这个:
<!DOCTYPE html>
<head>
</head>
<body>
<p id="exp" onmouseover="over()" onmouseout="out()" style="background- color: #FFD700;width: 100px;height: 250px;">
Expand Me!
</p>
<button onclick="run()">Run</button>
<script type="text/javascript">
function over() {
document.getElementById("exp").style.width = "250px";
}
function out() {
document.getElementById("exp").style.width = "100px";
}
</script>
<div id="x" style="background-color: #0FF"> </div>
</body>
</html>
但我希望它慢慢地出来，而不是立即返回，我相信有更好的方法可以做到这一点，因为我不想逐个像素地让它变慢，因为会滞后网页
最佳答案
我认为 CSS 转换最适合这个，不需要 JS。
div {
width: 25px;
overflow: hidden;
transition: width 1s;
}
div:hover {
width: 100%;
}<div>123456789123</div>关于javascript - 悬停时 HTML/JavaScript 展开按钮/div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42282997/