小编Yar*_*atz的帖子

显示/隐藏动画元素

我正在创建一个网站，并且试图创建一个按钮来切换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";
  }
}

Run Code Online (Sandbox Code Playgroud)

<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>

Run Code Online (Sandbox Code Playgroud)

当前的输出很棒，但我希望它具有动画效果。

html javascript css

Yar*_*atz

2019 04-11

5
推荐指数

2
解决办法

327
查看次数