jquery - Jquery 切换事件改为切换可见性

Question

这是我的 jQuery：

$('#help').toggle(function () {
  $('#center').animate({
    paddingTop: '70px'
  }, 200);
  $('.child_help').slideDown(300);
}, function () {
  $('#center').animate({
    paddingTop: '50px'
  }, 200);
  $('.child_help').slideUp(300);
});

当我加载页面时，它会切换#help. 我想要做的是当你点击它时，它应该.child_help向上或向下滑动，并做一些填充动画。
在 jQuery API 上，它只说：
Note: jQuery also provides an animation method named .toggle() that toggles the visibility of elements. Whether the animation or the event method is fired depends on the set of arguments passed.

我可以看到的触发事件或切换可见性之间的唯一区别是，如果它是$('#help').toggle(function () { do something here })，而不是$('#help').toggle('slow');

我在这里缺少什么吗？

编辑：以下是我的 HTML

<div id="center">
  <div class="child_help">
    some help text here
  </div>
  <div class="child">
    <b>Account Activation</b>
    <img src="/css/images/help.png" alt="" id="help" />
  </div>
  <form method='post'>
    <input type="text" name="code" value="Code" class="code" />
    <span class="case">Case-sensitive</span>
    <input type="submit" name="submit" value="Activate" class="submit" />
  </form>
</div>

Answer 1

演示

$(function(){
  $("#help").click(function(){
     var padding="70px";
     if($(".child_help").css("display")=="none") padding="50px";

     $('#center').animate({
         paddingTop: padding
     }, 200);

     $(".child_help").slideToggle();
  });
});