>

jquery를 통해 내용을 변경 한 다음 setInterval 함수를 사용하여 속도 js 라이브러리를 사용하여 페이드 인 및 페이드 아웃하는 태그가 있습니다. 내가 이것을 실행할 때 그것은 약 30 초 동안 제대로 작동하는 경향이 있으며 오작동하기 시작하고 jquery는 태그가 사라지기 전에 태그의 내용을 변경하기 시작합니다.

자바 스크립트 코드는 다음과 같습니다

let counter = 0;
function chooseWord() {
    let words = ["foo", "bar", "foo"];
    if (counter !== 2) {
        counter += 1;
    } else {
        counter = 0;
    }
    return words[counter];
}
function refreshText() {
    $("#div").text("Foo " + chooseWord())
        .velocity("fadeIn", {
            duration: 2500
        })
        .velocity("fadeOut", {
            delay: 1500,
            duration: 2500
        });
}
$(document).ready(function() {
    refreshText();
    setInterval(function() {
        refreshText();
    }, 7000);
});

여기에 사용중인 태그가 있습니다

<h1 class="foobar" id="div"></h1>

Jquery의 타이머를 사용해 보았는데 같은 문제가 있습니다. 누구든지 문제가 무엇인지 또는 내가하고 싶은 것을 성취하는 다른 방법을 알고 있습니까?


  • 답변 # 1

    작업 순서 만 변경하면됩니다. 페이드 아웃 후 텍스트 변경 명령을 이동했습니다. 따라서 요소가 희미 해지면 jQuery가 텍스트를 업데이트합니다.

    $("#div")
    .velocity("fadeIn", {
      duration: 2500
    })
    .velocity("fadeOut", {
      delay: 1500,
      duration: 2500
    })
    .text("Foo " + chooseWord());
    
    

    바이올린 : https://jsfiddle.net/Nisarg0/gLed0h1y/

  • 이전 vb.net - 레지스트리 키가 작동하지 않는지 확인
  • 다음 google apps script - HTML 편지 병합에서 정규 표현식 후 잘못된 플래그를 수정하는 방법