首页 > 解决方案 > 使用 HTML/Javascript 更改循环文本的字体的问题

问题描述

我试图让同一段文字消失并重新出现在我的网站上,同时每次都更改字体。我不知道为什么,但字体只显示为if/elseif/else块中的第一个字体。在这种情况下,它总是显示'Chango'

var element = document.getElementsByClassName('name')[0];   
const tl = gsap.timeline( {default: {ease: "power1.out"} } );

for (i = 0; i < 10; i++) {
    if (i % 3 == 0) {
        element.style.fontFamily = 'Chango';
    } else if (i % 3 == 1) {
        element.style.fontFamily = 'Pangolin';
    } else {
        element.style.fontFamily = 'Train One';
    }

    //console.log(i % 3);
    //console.log(element.style.fontFamily);

    tl.to(".name", {y: "0%", duration: 1});
    tl.to(".name", {y: "-100%", duration: 1, delay: 0.5});
    tl.to(".name", {y: "100%", duration: 0});
}

标签: javascriptloopsfonts

解决方案


推荐阅读