Question

简单问题：我有一个div想要 fadein 而不使用display:none和div上的css，因为它摆脱了{ {1}}，而不是隐藏它，使其下方的元素向上移动。

当我使用div或opacity:0时，visibility:hidden无效。

Answer 1

您可以使用x[2][1][3]更改$.fadeTo()而不是opacity，方法与display相同。

您还可以切换更改$.fadeIn()的类并在CSS中使用opacity来处理“淡入淡出”效果。

transition

$('#fadeto').fadeTo(1000,1);
$('#css').addClass('visible');

#fadeto {
  opacity: 0;
}
#css {
  opacity: 0;
  transition: opacity 1s;
}
#css.visible {
  opacity: 1;
}

Answer 2

在jQuery中，如果您只是希望在不更改显示属性的情况下淡出，则可以使用以下内容：

$element.animate({ opacity: 0 }, 1000);

例如：

$('#fade').click(function(){
    $('#fadeout').animate({ opacity: 0 }, 1000);
})

#fadeout{
     width: 100px;
     height: 100px;
     background: blue;
     color: white;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="fade">Fade out now</button>
<br />
<div id="fadeout">I'm visible atm</div>
<div>some other stuff</div>

Jquery fadeIn（），不透明度：0或可见性：隐藏

2 个答案: