javascript - 如何隐藏和显示div并具有特殊效果

Question

引用 Vytautas Butkus 先生，我使用了他的代码，使用他的代码我可以获得垂直效果，但我想要显示和隐藏的水平效果。

$(document).ready(function(){
      var $content = $(".content").hide();
      $(".toggle").on("click", function(e){
        $(this).toggleClass("expanded");
        $content.slideToggle();
      });
    })

所以请建议我如何处理div的水平隐藏和显示效果？

Answer 1

slideToggle 可以向上和向下滑动。因此，请使用 .animate() 而不是 .slideToggle()

您可以使用

$('selector').animate({width: 'toggle'});

您的代码:

   $(document).ready(function(){
          var $content = $(".content").hide();
          $(".toggle").on("click", function(e){
            $(this).toggleClass("expanded");
            $content.animate({width: 'toggle'});
          });
        })