Jquery 함수는 매번 클릭 트리거를 반복해야합니다 (그러나 그다지 없습니다)

Question

글쎄,이 beautifull 작은 사이트에는 overflows:hidden 래퍼에 맞는 콘텐츠가있는 div가 있습니다. 스팬을 클릭 할 때마다 margin-top: $value-120px을 원합니다. class'd .maisfilme. 이것이 내가 얻은 것입니다.

$(document).ready(function(){ 
$(".maisfilme").on("click", function() { 
    var $mtop = $(this).css('margin-top'); 

     var $vai = (parseInt($mtop)+ 110 + "px"); 
    $("#filme").css ({ 
     'margin-top' : "-"+$vai 
    }); 
}); 
}); 

사실은 그 일을합니다. margin-top을 얻고, int 값을 + 120px 증가시키고, div를 슬라이드하기 전에. 실제 문제는 단지 한 번 발생한다는 것입니다. 한 번 더 .maisfilme을 클릭하면 아무 일도 발생하지 않습니다.
다른 사람이해야 할 일을 알 수 있도록 함수가 매번 작용합니다. .maisfilme 클릭 했습니까?

Answer 1

두 번째로 - (- 110 + 110)이 될 것이므로 원하는만큼 크기가 증가하지는 않습니다. 매번 부정적인 영향을주기를 원한다면 서명의 논리를 변경해야합니다.

또한 $(this)에서 CSS를 가져 오지만 $("#filme")에 설정하면 동일한 개체가 아닌 한 매번 올라 가지 않습니다. 그것들은 당신이 클릭 할 때마다 누적되기 위해 동일 할 필요가 있습니다.

이 더 부정적인마다 갈 수 있도록하기 위해, 당신이 할 수 있습니다 :

$(document).ready(function(){ 
    $(".maisfilme").on("click", function() { 
     var $mtop = $(this).css('margin-top'); 

     var $vai = (parseInt($mtop) - 110) + "px"; 
     $(this).css ({ 
      'margin-top' : $vai 
     }); 
    }); 
}); 

또는 약간 다른 결과를 제공 약간 다른 버전을 여백 정상의 초기 값이 0이 아닌 경우 (자세한) 첫 번째 반복이 무엇을 같은 :

$(document).ready(function(){ 
    $(".maisfilme").on("click", function() { 
     var $mtop = $(this).css('margin-top'); 

     var $vai = (-(Math.abs(parseInt($mtop)) + 110)) + "px"; 
     $(this).css ({ 
      'margin-top' : $vai 
     }); 
    }); 
});