0

これは私の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>
4

1 に答える 1

0

デモ

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

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

     $(".child_help").slideToggle();
  });
});
于 2013-02-19T16:45:15.667 に答える