如何同步和突出显示 HTML 文本到音频

How to synchronize and highlight HTML text to audio

我想在网站中播放音频时突出显示文本。 随着音频的播放,这段文字将继续突出显示,就像我们在电视中看到的那样。

请告诉我如何使用任何网络技术做到这一点。

我会非常感谢你们所有人。 提前致谢。

这里有一个与此类似的问题可以回答您关于如何突出显示文本的问题: Simple JavaScript Animation for 1 Second to Highlight Text?

HTML5 适用于音频: http://www.w3schools.com/html/html5_audio.asp

这些资源有望让您走上正轨!

您需要使用所需的字幕(文本)创建自己的 vtt 文件。然后 link 它像这样的音频代码:

    <audio src="sampleaudiofile.ogg">
      <track kind="captions" src="sampleaudiofile.en.vtt" srclang="en" label="English">
    </audio>
来自 w3c 规范的

This link 显示了 vtt 格式的示例以及如何操作。