页面加载后向下滑动

Question

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

HTML：

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

JS：

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

Answer 1

您需要display: none;首先像这样使用 CSS制作标题：

<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();
});