當頁面加載時滑動div

Question

我需要創建一個函數，它會在頁面加載時爲div滑動。它需要將動畫延遲約5秒鐘。上面的例子可以在此鏈接

http://www.exacttarget.com/blog/amazon-dash-the-skinny-on-this-stick/

剛下標題可以看到有一個與股數的部分。我需要創建一個函數來滑動包含所有數字彙總的項目。這是灰色背景右側的那個。

Answer 1

$(document).ready(function() { 
     $("#slideBox").delay(5000).show("slide", { direction: "right" }, 1200); 
}); 

Answer 2

嘿，我是不是的CSS專家，但什麼該網站的人做是CSS位爲well.So我做了這個的jsfiddle。這可能會幫助你。我是不知道這會在所有瀏覽器裏工作這麼far.You可以使用jQuery的回落對誰不支持CSS3過渡的瀏覽器 我使用的代碼是：

div 
{ 
    width:100px; 
    height:100px; 
    background:red; 
    transition-property: margin-left; 
    transition-duration: 2s; 
    -webkit-transition-property: margin-left; /* Safari */ 
    -webkit-transition-duration: 2s; /* Safari */ 
    margin-left:-100px; 
} 
div.active 
{ 
    margin-left:0px; 
} 

jQuery的代碼是：

$(function(){ 

$(".mydiv").addClass("active"); 
console.log($(".mydiv")); 

}); 

Fiddle

Answer 3

HTML

<div id="upper_div"></div> 
<div id="slideBox"></div> 

CSS

#upper_div{ 
    width:200px; 
    height:50px; 
    background-color:#E5E5E5; 
    float:left; 
} 

#slideBox{ 
    width:50px; 
    height:50px; 
    background-color:#CCCCCC; 
    float:left; 
    display:none; 
} 

jQuery的

$(document).ready(function() { 
     $("#slideBox").delay(5000).show("slide", { direction: "right" }, 1200); 
}); 

DEMO