使用引导程序的淡入面板

fadeIn panel using Bootstrap

本文关键字：淡入 引导程序      更新时间：2023-09-26

我想淡化我在 Bootstrap 3 中制作的面板形式。我尝试了不同的方法，但我无法弄清楚。

这是JSFiddle。

这是我的淡入淡出功能：

$( document ).ready(function() {
    $( ".anim" ).fadeIn( "slow" );
});

也可以这样做

将 .anim {display：none} 添加到 CSS 中，然后在 

$( document ).ready(function() {
  $( ".anim" ).fadeIn( "slow" );
});

http://jsfiddle.net/1egdn3wx/1/

您需要在 css 中隐藏 .anim，以便它可以淡入。

.anim {
  display: none;
}
您必须

考虑fadeIn方法使.anim元素的不透明度从当前变为 1。因此，由于 .anim 的当前不透明度为 1，因此fadeIn()考虑淡入淡出。

您应该在fadeIn之前执行 hide() 方法。所以你的脚本将变成如下。

$( document ).ready(function() {
  $( ".anim" ).hide().fadeIn( "slow" );
});

编辑：我已经用这个工作演示分叉了你的小提琴

相关文章：