页面加载后滑动

Question

以下是我的代码。我想 - 当页面加载时，标题类将不可见，但加载页面后，它将向下滑动。我该怎么做？谢谢。

HTML：

      <div class="header" style="width:100%;height:300px;background-color:#999">
      </div>

JS：

     $(document).ready(function() {
        $('.header').slideDown();
     });

Answer 1

您需要首先使用CSS制作标题display: none;，如下所示：

<div class="header" style="width:100%;height:300px;background-color:#999; display: none;">
  </div>

然后你的JS将展示它并像这个小提琴一样执行动画：

http://jsfiddle.net/S8XjL/

如果您的意思是在页面上的所有内容都已加载后，您可能希望将JS更改为：

$(window).on("load", function(){
    $('.header').slideDown();
});

使用jQuery的ready函数会在DOM准备就绪后导致标题丢失，但不一定在页面加载完成时删除：

$(document).on("ready", function(){
    $('.header').slideDown();
});

Answer 2

只需在display:none

中提及CSS即可

<div class="header" style="width:100%;height:300px;background-color:#999; display:none">
          </div>