如何使 addEventListener 同步

Question

当窗口加载带有类预加载的 div 时，过渡 0.5s 不会消失；它立即消失。我想先用过渡 0.5s 消失然后添加显示无window.addEventListener('load', () => {      $('.preload').css({         'opacity': '0',         'transition': '0.5s'      });   });   $('.preload').css('display': 'none');

Answer 1

我认为这是实现这一目标的最短途径。fadeOut是一个 jquery 方法，它创建一个动画，用于淡入淡出效果，并在元素完全淡出时设置display为。参数是innone的时间。transitionmilliseconds

在这里检查fadeOut：淡出

$(window).on('load', () => {

  $('.preload').fadeOut(500);

});

html, body{

  margin: 0;

}

.preload {

  height: 200px;

  width: 100vw;

  background: red;

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="preload"></div>