我正在创建一个网站,试图创建一个可以切换div元素可见性的按钮。现在它对我有效,但是我想添加动画效果,但就是做不到。我已经尝试将“block”更改为“fadeIn()”,将“none”更改为“fadeOut()”,但没有起作用。有什么想法吗?
function pcsh1() {
var x = document.getElementById("pc1");
if (x.style.display === "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
}
<button onclick="pcsh1()">Show / Hide PC 1</button>
<div id="pc1">
<textarea rows="2" cols="20" placeholder="PC Name" class="pcbox">PC Name: </textarea>
<textarea rows="2" cols="20" placeholder="Alignment" class="pcbox">Alignment: </textarea>
<textarea rows="2" cols="20" placeholder="Max HP" class="pcbox">Max HP: </textarea>
<textarea rows="2" cols="20" placeholder="Current HP" class="pcbox">Current HP: </textarea>
</div>
目前的输出很好,但我希望它有一个动画效果。
fadeIn()
和fadeOut()
是jQuery函数。您正在使用jQuery吗? - j08691fadeIn()
和fadeOut()
吗? - 3rdsty4bl00d