如何将fadein效果应用于函数？

Question

我用JS创建了我的整个html。 这是一个例子：

function createBanner () {
    $('body').append(
      $('<div>')
      .attr('id',"banner")
      .attr('class',"banner")
      .append(
      ....           

执行该函数时，它会为页面创建整个标记。

如何使用“fadeIn”jQuery效果调用createBanner。 元素最初不在页面中。 这就是为什么不可能以通用的方式选择它们。

Answer 1

您可以创建需要附加的标记对象，使用.hide()隐藏它。 然后使用.appendTo()和.fadeIn()将其附加到正文以使淡入效果：

 $('<div>').attr('id',"banner").attr('class',"banner").append(....)
      .hide()
        .appendTo("body")
          .fadeIn(500);  

工作演示

Answer 2

您可以尝试在append（）之后隐藏它; 然后淡入它。

Answer 3

快速方式如下。 你可以将它绑定到一个事件。

 $(function(){ var dv = $('<div>'); $('body').append(dv.attr('id',"banner").attr('class',"banner").html("Some kind of content")); $('.banner').last().fadeIn(3000) }) 

 .banner{ display:none; font-size: 70px; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>