자바 스크립트 애니메이션 패널에 닫기 버튼 추가

Question

링크를 클릭 할 때 다음 자바 스크립트를 사용하여 오른쪽 패널을 오른쪽으로 슬라이드합니다.

jQuery를 (함수 ($) {

$('a.panel').click(function() { 
    var $target = $($(this).attr('href')), 
     $other = $target.siblings('.active'), 
     animIn = function() { 
      $target.addClass('active').show().css({ 
       left: -($target.width()) 
      }).animate({ 
       left: 0 
      }, 500); 
     }; 

    if (!$target.hasClass('active') && $other.length > 0) { 
     $other.each(function(index, self) { 
      var $this = $(this); 
      $this.removeClass('active').animate({ 
       left: -$this.width() 
      }, 500, animIn); 
     }); 
    } else if (!$target.hasClass('active')) { 
     animIn(); 
    } 
}); 

});

모든 패널에 닫기 버튼을 추가하고 클릭하면 패널이 닫히거나 왼쪽으로 밀려납니다.

나는이 jsfiddle이

어떤 아이디어를주십시오 일할 수 있나요? 감사. 여기

Answer 1

당신은 갈 -

Working Demo

$('.close').click(function(){   
     $(this).closest('.panel').animate({ 
        left: -200 
       }, 500); 
    });