Question

在两个函数之间切换时我想要慢动画。要了解以下切换功能。

$("p").toggle(function(){$("p").css({"color": "red"});},
function(){$("p").css({"color": "blue"});
});

如何在此场景中将“慢”作为参数???

Answer 1

您可以使用css转换：

示例：

想象一下，你有一个按钮，当你按下它时你想要改变DIV的背景颜色并带来一个很好的过渡。所以，我们有一个Button和DIV，以免这样做：

jsfiddle： https://jsfiddle.net/obpxsyq3/

<强> HTML：

<button id='mybutton'>
   Try me!
</button>
<br>
    <br>
<div id='target_div'>

</div

<强>的CSS：

#target_div {
  background-color: #000;
  width: 200px;
  height: 200px;   
  border: 1px solid #000;
  -webkit-transition: background-color 2s; /* Safari */
  transition: background-color 2s;
}

.transition_class {
  background-color: #fff !important;
}

<强>的Javascript / Jquery的：

$('#mybutton').click(function() {
  $('#target_div').addClass('transition_class');
});

我建议你阅读一些关于css过渡的内容，你会爱上它！

希望这有帮助！

在两个功能之间切换时想要“慢效”吗？

1 个答案: