javascript - 想要使用 Javascript 而不是 vw 作为我的字体大小

Question

我不想在我的字体中使用 vw，因为许多浏览器和设备不支持它。所以我想使用 Javascript 而不是 vw 以便我的字体大小随着我调整屏幕大小而改变。谁能给我完整的代码？只要给我一个完整的例子和完整的代码，然后我会自己做:) 谢谢。

Answer 1

超级简单的例子。您需要向resize窗口添加一个事件侦听器，然后根据屏幕大小 ( innerWidth) 您可以更改元素的样式。

（以整页模式运行示例）

编辑：在每个窗口调整大小时添加了文本大小调整。更改fontSize以设置初始大小。

let fontSize = 38;
let lastWidth = 0;

window.addEventListener('resize', e => {

  if(window.innerWidth < lastWidth) {
    fontSize = fontSize - 2;
    document.querySelector('span').style.fontSize = `${fontSize}px`;
  } else {
    fontSize = fontSize + 2;
    document.querySelector('span').style.fontSize = `${fontSize}px`;
  }
  
  lastWidth = window.innerWidth;
});

span {
  font-size: 38px;
}

<span>Text Size</span>