Скользящий контейнер DIV

Question

Как сделать скользящий горизонтальный контейнер DIV с помощью jquery? Пока у меня есть код ниже. Проблема в том, что содержимое <h1 id="filter_content">Content</h1> изначально не скрыто. Кроме того, я видел очень красивые складки вверх по меню, что-то вроде первого снимка экрана here. Таким образом, когда пользователь нажимает на +, содержимое сместится. Где я могу найти пример кода или какой-нибудь пример?

<div id="filter"> 
    <h1>Filter</h1><br> 
</div> 
<h1 id="filter_content">Content</h1> 

<script> 
$('#filter').click(function() { 
    if ($("#filter").is(":hidden")) { 
      $("#filter_content").show("slow"); 
     } else { 
      $("#filter_content").slideUp("slow"); 
     } 
    }); 
</script> 

Answer 1

Хийя working demo click hereилиInitially hidden demo here

с помощью slideToggle API: хорошо прочитать http://api.jquery.com/slideToggle/ будет делать трюк для точного поведения вы ищете.

код

$('#filter').click(function() { 

      $("#filter_content").slideToggle("slow"); 

    }); 
​