Html 向下滑动切换按钮上的Div

我有以下代码，可以在单击时创建div，但我希望div缓慢向下滑动，而不是立即显示：

function hideshow(which) {

if (!document.getElementById) return
if (which.style.display == "none") which.style.display = "block"
else which.style.display = "none"

我发现一些代码似乎可以实现我所追求的目标，但我很难将其集成到现有代码中（如上所述）：

如果这有帮助的话，我已经将其粘贴在js fiddle上（支持css）：

及

使用jquery属性“slideDown”

---

谢谢科洛，非常感谢你的时间和努力。

$(document).ready(function() {
$("#button").toggle(function() {
    $(this).text('Hide');
}, function() {
    $(this).text('show');
}).click(function(){
    $("#hidden_content").slideToggle("slow");
});

function hideshow() {

  var i = 1;
  if (document.getElementById('effet').style.display == "none") {




    $('#effet').slideDown("normal");
    document.getElementById('effet').style.display = "block";
    i = 2;


  } else {

    if (i == 1) {
      $('#effet').slideUp("normal", function () {
        document.getElementById('effet').style.display = "none";
      });
    }

  }
}