문자로 문자를 페이드 아웃 한 다음 문자를 페이드 아웃하려면 자바 스크립트를 사용하십시오.

Question

웹 사이트를 만들고 사이트에 들어가면 문자로 문자가 희미 해지고 일정 시간 후에 전체 문장으로 사라집니다. 문자를 문자로 표시하는 코드가 있지만 문자가 나타나지 않고 "페이드 인"해야합니다. 그런 다음 전체 문장이 표시되면 모두 한 번에 사라지고 반복되지 않습니다. CSS로 이것을 참조 할 필요가 있습니다.

var showText = function (target, message, index, interval) {  
    if (index < message.length) { 
    $(target).append(message[index++]); 
    setTimeout(function() { showText(target, message, index, interval); }, interval); 
    } 
} 

$(function() { 
    showText("#msg", "Hello, World!", 0, 500);  
}); 

아래 링크는 문자로 표시되는 글자입니다. http://jsfiddle.net/VZvK7/

어떤 도움 주셔서 감사합니다!

Answer 1

문자가 희미하게 보이게하려면 글자의 불투명도를 변경해야합니다. How to do fade-in and fade-out with JavaScript and CSS에이 질문에 대한 답변이 이미 있으며, 거기서 바닐라 JS의 솔루션을 제공하기도합니다.

코드의 주요 개념은 초기 불투명도 수준을 설정하는 것입니다.이 불투명도 수준은 문자를 표시 할 준비가되었을 때 매우 낮으며 특정 간격으로 불투명도를 점차적으로 증가시킵니다.