jquery - jQuery左右滑动 - 编写代码的更简单方法？

Question

我有一些 jQuery，我认为可以写得更简单，我是 jQuery 新手，我还想在代码中添加滑入和滑出动画，但不知道如何最好地做到这一点。任何帮助都会很棒。

$(document).ready(function() {
  $('.utilTabFilter').click(function() {
    if($('#sideFilter.smallScreenFilter').css("left")=="0px")
    {
        $('#sideFilter.smallScreenFilter').css("left","-232px");    
        $('.smallScreenFilter .utilFollowFilter').css("display","none");
    }
    else
    {
        $('#sideFilter.smallScreenFilter').css("left","0");
        $('.smallScreenFilter .utilFollowFilter').css("display","block");
    }       
  });
});

Answer 1

将您的样式放入 CSS 类中：

.myClass { left: -232px }

并在点击时切换它。加上使用.toggle()方法来切换可见性：

$('.utilTabFilter').click(function() {
   $('#sideFilter.smallScreenFilter').toggleClass('myClass');
   $('.smallScreenFilter .utilFollowFilter').toggle();
});