gpt4 book ai didi

javascript - 如何将 fadeIn 添加到我的 show_hide() 函数中?

转载 作者:行者123 更新时间:2023-11-28 15:06:41 27 4
gpt4 key购买 nike

我有一个函数。当您将鼠标悬停在 div 上时,它会显示一个删除按钮,而当鼠标移开时,它会隐藏它。现在,我只需要将 fadeIn 添加到我的 show_hide 函数中,而不是直接显示。我怎样才能做到这一点?

HTML

<div onmouseover="show_hide('deletebutton')" onmouseout="show_hide('deletebutton')">

// image

<div id="deletebutton" style="display:none">DELETE</div>

</div>

JS

function show_hide(id) {
var e = document.getElementById(id);
if (e == null){
} else {
if (e.style.display == 'block')
e.style.display = 'none';
else
e.style.display = 'block';
}
}

最佳答案

如果您可以使用 jQuery,请尝试这个示例。

看到这个plunker

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>fadeIn demo</title>
<style>
span {
color: red;
cursor: pointer;
}
div {
margin: 3px;
width: 80px;
display: none;
height: 80px;
float: left;
}
#one {
background: #f00;
}
#two {
background: #0f0;
}
#three {
background: #00f;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>

<span>Click here...</span>
<div id="one"></div>
<div id="two"></div>
<div id="three"></div>

<script>
$( document.body ).click(function() {
$( "div:hidden:first" ).fadeIn( "slow" );
});
</script>

</body>
</html>

source

关于javascript - 如何将 fadeIn 添加到我的 show_hide() 函数中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38651588/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com