jquery - Jquery スライダー機能

Question

ユーザーが「閉じる」をクリックしたときに、このページの「友達に知らせるボタン」を元の位置に戻そうとしていますが、何か違うことをします。クリックするとスライドして開き、ユーザーが閉じるをクリックすると反対のことをしたい。関数を以下に示します。

$(document).ready(function() {
    $(".tell").click(function () {
        $("DIV#tellform").show("slide", { direction: 'left' }, 2000);
        $(".tell").hide("fade", {}, 1);
    });

    $(".closer").click(function () {
        $("DIV#tellform").show("slide", { direction: 'right' }, 0);
    });
});

HTML は次のようになります。

<div class="closer">
    <a href="#">X close</a>
</div>

Answer 1

以下に示すように関数を変更しましたが、今では私が望むことを正確に実行しています。

<script type="text/javascript">

    $(document).ready(function() {

   $(".tell").click(function () {

      $("DIV#tellform").show("slide", { direction: 'left' }, 2000);

      $(".tell").hide("fade", {}, 1);

});

   $(".closer").click(function () {

      $("DIV#tellform").hide("slide", { direction: 'left' }, 2000);
      $(".tell").show("fade", {}, 1);

      });

  });



</script>

Answer 2

またはこれ：

$(".tell").click(function () {

    $(".tell").hide();
    $("#tellform").animate({
      width: 'toggle'
    }, 2000 );

});


$(".closer").click(function () {

    $("#tellform").animate({
      width: 'toggle'
    }, 2000, function(){
        $(".tell").show();
    });

});

Answer 3

変化する

$("DIV#tellform").show("slideTo", { direction: 'right' }, 0);

に

$("DIV#tellform").show("slideTo", { direction: 'left' }, 0);