Slideup and Slidedown to reveal a div

Question

你能告訴我怎樣才能上下邊框，然後滑下來揭示另一個div的內容。我希望內容div中的文本以與消息框底部邊框相同的速度向下滑動。

的HTML被

<div id="message-box"> 
<div id="content"> 
Lorem ipsum dolor sit amet, minim accusamus dignissim has at, nec esse quas postea in. Vide harum id mei, aperiam legimus delectus an est. Sit quidam verear voluptatum ad, vim definiebas reprimique cu. Eu sea bonorum meliore, possim albucius complectitur vel et. Eum ne ferri persius abhorreant, mel in probatus pertinax, ex usu meliore corpora. 
</div> 
</div> 

的CSS是：

#message-box { 
position:absolute; 
left:20px; 
top:40px; 
height:450px; 
width:200px; 
background:#eee; 
margin-left:0px; 
text-align:center; 
border-top: solid 1px #000; 
border-bottom:solid 1px #000; 

} 

#content { 
position:relative; 
top:0px; 
height:350px; 
font-size:16px; 
padding:20px; 
color:#000; 
display:none; 
} 

的jQuery是：

var speed = 500; 

$('document').ready(function() { 
$('#message-box').slideUp(speed).delay(50).slideDown('speed'); 

    }); 

Answer 1

document不是字符串

更換

$('document').ready(function() { 

與

$(document).ready(function() { 

Answer 2

實際文檔對象（而不是一個字符串）被傳遞到的jQuery在選擇用於準備功能。此外，#content元素的display屬性設置爲none。您需要在動畫完成後顯示內容。

var speed = 500; 

$(document).ready(function() { 
    $('#message-box').slideUp(speed).delay(50).slideDown('speed', function(){ 
     $("#content").fadeIn(); 
    }); 
}); 

工作實例http://jsfiddle.net/AEzUk/1/

Answer 3

糾正你的代碼不把文檔作爲字符串和速度var當成字符串..

$(document).ready(function() { 
var speed = 500; 
$('#message-box').slideUp(speed).delay(50).slideDown(speed); 

    }); 

Answer 4

var speed = 500; 

$(document).ready(function() { 
$('#message-box').slideUp(speed).delay(50).slideDown('speed'); 

    }); 

更正你的jQuery