如何淡出并固定此处的重置按钮?

时间:2019-05-13 01:17:05

标签: javascript button fadeout

document.getElementById("shrinkBtn").addEventListener("click", function() {

  document.getElementById("box").style.height = "25px";

});

document.getElementById("growBtn").addEventListener("click", function() {

  document.getElementById("box").style.height = "250px";

});

document.getElementById("fadeOutBtn").addEventListener("click", function() {

  document.getElementById("box").style.opacity = "slow";

});
document.getElementById("resetBtn").addEventListener("click", function() {

  document.getElementById("box").style.height = "150px";

});
<p>Press the buttons to move the box!</p>

<div id="box" style="height:150px; width:150px; background-color:teal; margin:25px"></div>

<button id="shrinkBtn">Shrink</button>
<button id="growBtn">Grow</button>
<button id="fadeOutBtn">Fade Out</button>
<button id="reset">Reset</button>

我添加了两个按钮,但它破坏了重置按钮。我真正需要的是:

<button id="growkBtn">Grow</button>
<button id="blueBtn">Blue</button>
<button id="fadeOutBtn">Fade Out</button>
<button id="reset">Reset</button>

1 个答案:

答案 0 :(得分:0)

您可以使用CSS通过更改类来创建淡入淡出效果,并使用重置按钮来更改重置类和高度。

此外,您在resetBtn eventListiner中使用了错误的Traceback (most recent call last): File "DQN_tf_NoisyNet.py", line 315, in <module> main() File "DQN_tf_NoisyNet.py", line 252, in main target_net = copy.deepcopy(q_net) File "/usr/lib/python3.5/copy.py", line 182, in deepcopy y = _reconstruct(x, rv, 1, memo) File "/usr/lib/python3.5/copy.py", line 299, in _reconstruct y.__setstate__(state) File "/usr/local/lib/python3.5/dist-packages/keras/engine/network.py", line 1266, in __setstate__ model = saving.unpickle_model(state) File "/usr/local/lib/python3.5/dist-packages/keras/engine/saving.py", line 435, in unpickle_model return _deserialize_model(f) File "/usr/local/lib/python3.5/dist-packages/keras/engine/saving.py", line 225, in _deserialize_model model = model_from_config(model_config, custom_objects=custom_objects) File "/usr/local/lib/python3.5/dist-packages/keras/engine/saving.py", line 458, in model_from_config return deserialize(config, custom_objects=custom_objects) File "/usr/local/lib/python3.5/dist-packages/keras/layers/__init__.py", line 55, in deserialize printable_module_name='layer') File "/usr/local/lib/python3.5/dist-packages/keras/utils/generic_utils.py", line 145, in deserialize_keras_object list(custom_objects.items()))) File "/usr/local/lib/python3.5/dist-packages/keras/engine/network.py", line 1022, in from_config process_layer(layer_data) File "/usr/local/lib/python3.5/dist-packages/keras/engine/network.py", line 1008, in process_layer custom_objects=custom_objects) File "/usr/local/lib/python3.5/dist-packages/keras/layers/__init__.py", line 55, in deserialize printable_module_name='layer') File "/usr/local/lib/python3.5/dist-packages/keras/utils/generic_utils.py", line 138, in deserialize_keras_object ': ' + class_name) ValueError: Unknown layer: NoisyLayer ,而在定位id时,idreset

resetBtn
document.getElementById("shrinkBtn").addEventListener("click", function() {
  document.getElementById("box").style.height = "25px";
});

document.getElementById("growBtn").addEventListener("click", function() {
  document.getElementById("box").style.height = "250px";
});

document.getElementById("fadeOutBtn").addEventListener("click", function() {
  document.getElementById("box").className = "hidden";
});
document.getElementById("resetBtn").addEventListener("click", function() {
  document.getElementById("box").style.height = "150px";
    document.getElementById("box").className = "visible";
});
.visible {
  visibility: visible;
  opacity: 1;
}

.hidden {
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s 2s, opacity 2s linear;
}