JqueryのslideIn（MooTools）と同じ効果を実現する方法は？

Question

私は後に何をしていますか？残念ながら、jQueryのslideDown()エフェクトは同じではありません。これは私が後になった効果です（コードとデモはjsFiddleにあります）。

jQueryにはanimate()メソッドがあります。しかし、MooToolのslideIn()メソッドと同じ効果を得るためには、正確に何が関与すべきでしょうか？

---- CSS ----

：ここ

Answer 1

は、あなたはすぐにあなたが望む効果に一致するようにコードを編集することができるはずとアウト（左/右）のjQueryでスライドさせる方法です

#container_div { 
    height: 200px; 
    width: 400px; 
    overflow: hidden; 
    float: left; 
} 
#inner_div { 
    height: 100%; 
    width: 100%; 
    position: relative; 
    background-color: #ccc; 
} 

---- jQueryの----

$('#toggle_link').live('click', function() { 
    if ($('#inner_div').css('left') == '0px') { 
     $('#inner_div').stop().animate({left: (-1 * $('#inner_div').width())}, 1000).parent().stop().animate({width: '0px'}, 1000); 
    } else { 
     $('#inner_div').parent().stop().animate({width: '400px'}, 1000); 
     $('#inner_div').stop().animate({left: '0px'}, 1000); 
    } 
}); 

---- HTML ----

<div> 
    <a href="#" id="toggle_link">TOGGLE</a> 
</div> 
<div id="container_div"> 
    <div id="inner_div">test in here</div> 
</div> 
some stuff to the right 

Answer 2

チェックアウトthis fiddleそれは閉じている間、ページ上のスペースを占有しないように、含まれているdivを折りたたみます。これはMooToolsの機能とほぼ同じです（MooToolsを知っているわけではありませんが、FirebugでCSSの変更を観察しました）。