typed.js를 사용하는 방법

typed.js는 무엇입니까

Typed.js는 유형을 지정하는 라이브러리입니다. 임의의 문자열을 입력하고 설정한 속도로 입력하는 것을 지켜보고 입력한 내용을 백스페이스하고 설정한 문자열에 대해 새 문장을 시작합니다.
이것은 기본 CSS 애니메이션 속성으로 만들 수 있는 순수한 CSS 애니메이션이지만 Typed.js를 사용하면 이 움직이는 텍스트 애니메이션 효과를 쉽게 만들 수 있습니다.

사용 방법

typed.js를 사용하려면 typed.js의 GitHub 링크로 이동해야 합니다.
CDN 파일 복사

<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>

프로젝트에 typed.js 추가

본문 태그를 닫기 전에 HTML 파일의 맨 아래에 CDN 파일을 추가하고 새 스크립트 태그를 엽니다. 전체 코드는 다음과 같습니다.

<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
<script>
    var typed = new Typed(".mov",{
    strings: [,  "Ganesh","Content Writer","Web Developer"] ,
    typeSpeed: 100,
    backSpeed: 100,
    loop: true

    })
</script>

이제 간단한 HTML 부분을 추가하여 types.js 코드를 활성화합니다.

  <h1> I'm  <span class="mov"> </span></h1>

이제 .mov 클래스가 이 전체 types.js 프로세스의 주요 요소이며 간단하다는 것을 알 수 있습니다.

전체 출력은 여기에 있습니다output.
파일과 코드가 포함된 myGitHub repository에 링크합니다.

또한 웹 개발과 관련된 콘텐츠와 실제로 도움이 되는 무료 리소스를 공유하고 있습니다.