javascript - 我正在尝试在加载时使 div 滑动，但我以前的解决方案不再有效？

Question

我昨天发布了这个，代码可以运行，但今天不行了。我似乎无法让我的 javascript 启动并显示 div 的动画？有什么想法吗？

我将 js 放在一个单独的文件中，并使用脚本标记从正文中触发它。

function slideOnLoad(){
  document.getElementById("right-scroll-slide").style.top="10px";
}
slideOnLoad();

#right-scroll-slide{
  -webkit-transition:all 1s;
  -ms-transition:all 1s;
  -moz-transition:all 1s;
  -o-transition:all 1s;
    position:absolute;
  top:-100px;
  background:red;
}

<div class="right-scroll-content" id="right-scroll-slide">aaaa</div>

我会包含一个 jsfiddle，但它现在似乎没有加载。

Answer 1

使用动画并将CSS中的top更改为margin-top

演示

http://codepen.io/anon/pen/Kwzqvq

Jquery

 function slideOnLoad(){
      $('#right-scroll-slide').animate({'margin-top':'0px'},0) 
    }
    slideOnLoad();

CSS

 #right-scroll-slide{
      -webkit-transition:all 1s;
      -ms-transition:all 1s;
      -moz-transition:all 1s;
      -o-transition:all 1s;
        position:absolute;
      margin-top:-100px;
      background:red;
    }