javascript - jquery で .animate() を使用する方法

Question

私のコードを確認していただければ幸いです。アニメ化したいだけ。「accordionHeader」クラスでdivタグの先頭位置を切り替えます。

<script type="text/javascript">
  $(document).ready(function() {
    $(".accordionHeader").toggle(function() {
      $(".accordionHeader").animate({"top": "0 144px"}, 500);
      function(){
        $(".accordionHeader").animate({"top": "144px 0"}, 500);
      );
  });
</script>

どうもありがとう。

Answer 1

もしかして：

$(document).ready(function(){
   $(".accordionHeader").toggle(
     function(){
        $(".accordionHeader").animate({"top": "144px"}, 500);
     },
     function() {
        $(".accordionHeader").animate({"top": "-144px"}, 500);
     });
});

別の方法として、jQuery.toggle（）は非推奨になっているため、次のこともできます。

$(".accordionHeader").on("click", function() {
    var clicked = $(this).data('clicked');
    if (clicked) {
        $(".accordionHeader").animate({"top": "144px"}, 500);
    }
    else {
        $(".accordionHeader").animate({"top": "-144px"}, 500);
    }
    $(this).data("clicked", !clicked);
});

Answer 2

クリックイベントでこれを試すことができます

 $('.accordionHeader').animate({ position: 'relative', top: '144px' }, 500);