jQuery가 작동하도록 전환 할 수 없습니다.

Question

나는 곧바로 생각할 수없는 그 시절을 보내고 있습니다.

기본적으로 왼쪽에서 슬라이드를 클릭하면 화면에 div가 표시됩니다 (정상적으로 작동 함). 다시 클릭하면 슬라이드가 필요합니다. 회 오버레이를 숨기고대로 전환 없음 :

CSS

정제 플라이 아웃 절대 그래서 디스플레이를 사용할 수 없다 회전기 내에 위치된다.

HTML

<div class="rotator-overlay"> 
<div class="tablet-flyout">+</div> 
</div> 

jQuery를

$('.tablet-flyout').click(function() { 
      $('.rotator-overlay').animate({ left: '0' }, 500); 
    }) 

내가 전에 slideToggle을 사용하지만, 디스플레이 블록/디스플레이 없음을 전환하는 경우에만 성공을 거두었습니다.

Answer 1

변수에 div 상태를 저장 한 다음 클릭 기능 내에서 확인해야합니다. 따라서 div가 화면에서 벗어난 경우 슬라이드를 밀어 넣으십시오.

변수를 사용하지 않으려면 항상 $('.rotator-overlay').css('left')을 확인하고 얻은 값에 따라 적절한 조치를 취하십시오. 이 같은

뭔가 (I 예로 들어 -200했다) :

$('.travel-search-tablet-flyout').click(function() { 
    if ($('.rotator-overlay').css('left') == 0) 
     $('.rotator-overlay').animate({ left: '-200' }, 500); 
    else 
     $('.rotator-overlay').animate({ left: '0' }, 500); 
}) 

Answer 2

은 슬라이드하려고하는 요소의 왼쪽을 확인 시도하고 사용 if 문 경우 앞뒤로 전환 할 수 있습니다. 대신 애니메이션의 사용과 별도로 전환 할 수있는 slideToggle() 메소드가있다

$('.travel-search-tablet-flyout').click(function() { 
    if ($('.rotator-overlay').css('left') == 0) { 
    // Slide the other way here, opposite 
    // $('.rotator-overlay').animate({ left: '????' }, 500); 
    } else { 
    // Your original animate 
    $('.rotator-overlay').animate({ left: '0' }, 500); 
    } 
})