如何在按下按钮时使用 JavaScript 在页面中心、其他元素上方显示大文本单词几秒钟？ [已关闭]

Question

我正在开发一个 Web 项目，我需要一个 JavaScript 片段来实现特定功能。

这就是我需要的： 本质上，每当按下按钮时，我想在页面中心、其他元素上方显示一个大文本单词几秒钟。

任何帮助或建议将不胜感激！谢谢你。

按下按钮后，页面中央应出现一个大文字。 文本单词应该在视觉上突出，并且最好在字体大小、颜色和字体系列方面进行自定义。 它应该适用于不同的浏览器和屏幕尺寸。

Answer 1

一个按钮，一个隐藏的

<div>

，一个简单的事件监听器和一个简单的超时。

var btn = document.getElementById("button");
var honk = document.getElementById("honk");

btn.addEventListener("click", () => {
  btn.disabled = true;
  honk.hidden = false;
  setTimeout(() => {
    btn.disabled = false;
    honk.hidden = true;
  }, 1500);
});

body {
  text-align: center;
  font-size: 30pt;
}

#honk {
  font-weight: bold;
  font-family: comic sans ms, fantasy;
  font-size: 250%;
  color: red;
  text-shadow: #FC0 0 0 3em;
}

<button id="button">Click me</button>
<div id="honk" hidden>HONK!</div>