애니메이션 원치 않는 지연

$(window).scroll(function(){ 
 
    var scrollTop = $(window).scrollTop(); 
 
     // Set navigation background 
 
     if (scrollTop > 50) { 
 
      $('.nav').animate({ 
 
       height: "90px", 
 
       backgroundColor: "rgba(0,0,0,0.7)" 
 
      });  
 
     } else { 
 
      $('.nav').animate({ 
 
       height: "120px", 
 
       backgroundColor: "rgba(0,0,0,0.0)" 
 
      });  
 
     } 
 
    });

.nav { 
 
    height: 120px; 
 
    width: 100%; 
 
    background-color: orange; 
 
    position: fixed; 
 
    } 
 

 
.content { 
 
    background-color: black; 
 
    height: 4000px; 
 
    width: 100%; 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="nav"></div> 
 
<div class="content"></div>

그럼 난이 jQuery 코드를 가지고 있고 그것이 내가이 문제를 해결할 수있는 방법, 그 위에 거대한 불필요한 지연을 가지고? Okey는 더 자세한 정보를 추가해야하는데, 이것은 내 탐색 바를 움직여야하는 코드입니다.하지만 6 초가 지연 될 것입니다.

출처

2016-12-14 Sander

전에 stop()을 추가 하시겠습니까? – Sharlike

애니메이션을 시작 하시겠습니까? – ahitt6345

하하하 ... 나는 애니메이션을 찍고 싶지만 6 초 동안 기다렸다가 움직이게된다. 잘 6 초 기다리는 시간이 필요 없다는 걸 알기를 바랍니다. – Sander

당신은 전혀 애니메이션 싶지 않아 animate

$('.nav').stop().animate(...)

출처

2016-12-14 20:31:45 Slonski

좋습니다! 내 문제를 해결, 고마워! 실제로 작동하는 이상한 일종의, 나는 단지 1 애니메이션을 내 qeue에서 생각할 수있다.하지만 잘 작동한다. – Sander

스크롤 할 때마다 다른 애니메이션을 트리거하고 애니메이션을'stop()'하지 않는 한 큐에서 실행한다. – Slonski

어딘가에 CSS 전환 지연이 있어야합니다. 애니메이션이 진행되는 동안 요소의 CSS를 검사 한 다음 다시 CSS로 추적하십시오.

출처

2016-12-14 20:13:59 Commodore64

이상한 나는 부드러운 불투명도 변화 (전환 : 버튼을 제외하고 내 CSS 코드에서 전환을 가지고 있지 않습니다 : 불투명 0.5s, 상단 0.2s;) – Sander

그게 CSS를 배제하는데, 보통 당신이 자바 스크립트 쪽에서 문제의 근원을 찾는데 집중할 수있게 해줄 겁니다. 전환 지연은 잠재적으로 어떤 부트 스트랩이나 다른 CSS 라이브러리에 들어있을 수도 있습니다. 애니메이션 문제에 대해 CSS를 배제하는 것이 내 목록의 첫 번째 일이 될 것이고 JS 사안에 대해 살펴볼 것입니다. 이 경우 대기중인 애니메이션이 쇼를 개최합니다. – Commodore64

애니메이션 원치 않는 지연

답변

관련 문제