如何在 jquery 动画完成后淡入 html

How do I fade html in after jquery animation is done?

本文关键字：淡入 html 动画 jquery      更新时间：2023-09-26

html 会立即淡入，我希望它在动画完成后淡入。这是一个旋转到屏幕顶部的图像，然后我希望其余部分淡入。我该如何让它工作？

以下是我想在动画完成后淡入的内容：

$('header, .main').fadeIn(2000);

以下是完整的jQuery：

  $( '.dimg-main' ).animate({ 
      top: "-=38%", 
      borderSpacing: -360 
  },{
      step: function(now) {
          $(this).css('-webkit-transform','rotate('+now+'deg)'); 
          $(this).css('-moz-transform','rotate('+now+'deg)');
          $(this).css('transform','rotate('+now+'deg)');
      },
      duration:4000,
  }),
  $('header, main').fadeIn(2000);

.css：

header, main{display: none;}

指定完整的回调函数。

$( '.dimg-main' ).animate({ 
  top: "-=38%", 
  borderSpacing: -360 
},{
  step: function(now) {
      $(this).css('-webkit-transform','rotate('+now+'deg)'); 
      $(this).css('-moz-transform','rotate('+now+'deg)');
      $(this).css('transform','rotate('+now+'deg)');
  },
  duration:4000,
  complete: function(){
        $('header, main').fadeIn(2000);
  }
});
相关文章：