如何发挥多个声音文件在一个网页? (点击最佳实践) [英] How to play multiple sound files on one Web Page? (on click best practice)

查看:150
本文介绍了如何发挥多个声音文件在一个网页? (点击最佳实践)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个页面,有词汇的列表。我对每个词汇的TTS。
我使用目前的做法是包括每个词汇的MP3闪存播放器。
这将创建延迟加载所有的闪光灯,因为可以有超过10个词汇在一个页面。

I have a page where there is a list of vocabularies. I have a TTS for each vocabulary. The current approach that I am using is to include an mp3 flash player for each vocabulary. This creates delay to load all the flash because there can be more than 10 vocabularies in one page.

另一个问题是,TTS文件的MP3必须在页面负载创建的,这也给延迟到装载时间

another problem is that the mp3 of the tts file has to be created on the page load, this also gives delay to the loading time.

在我脑海里的一些替代的方法是:

Some alternative approach in my mind is to:


  • 仅包括一个flash播放器。

  • 加载和播放上单击该文件以减少网页加载的TTS文件创建。

所以我的问题是,

是否有任何JavaScript或jQuery插件,可以做一个2其他方法?

Is there any javascript or jquery plugin that can do either of the 2 other approaches?

感谢您

推荐答案

您可以使用<音频> 标签(HTML5),你可以控制它时加载的文件。结果,
它最喜欢谷歌Chrome,火狐,歌剧...

You can use the <audio> tag (HTML5) and you can control it when to load the files.
It is supported in most of the browsers like Google Chrome, Firefox, Opera...

它有两种方法来设置链接:

It has two ways to set the link:

<audio src="YOUR FILE LINK HERE">
    <embed> <!--FALLBACK HERE (FLASH PLAYER FOR IE)--> </embed>
</audio>

路2

<audio>
    <source src="YOUR FILE LINK HERE (MP3)" type="audio/ogg" />
    <source src="YOUR OTHER FILE LINK HERE (OGG)" type="audio/mp3" />
    <embed> <!--FALLBACK HERE (FLASH PLAYER FOR IE)--> </embed>
</audio>


属性


  • 控制=控制如果你想让它显示的音频播放器。

  • 循环=循环如果你想让它循环的声音。

  • 自动播放=自动播放如果你想让它本身播放音频。

  • preLOAD =preLOAD如果你把它想preLOAD它。


  • Attributes

    • Put controls="controls" if you want it to display the audio player.
    • Put loop="loop" if you want it to loop the audio.
    • Put autoplay="autoplay" if you want it to play the audio by itself.
    • Put preload="preload" if you want it to preload it.
    • 您还可以使用JavaScript来控制它。

      You can also control it using JavaScript.

      要发挥它:的document.getElementById(您的音频TAG) .play() 结果
      要暂停:的document.getElementById(您的音频TAG) .pause()

      To play it: document.getElementById("YOUR AUDIO TAG").play()
      To pause it: document.getElementById("YOUR AUDIO TAG").pause()

      • http://w3schools.com/html5/tag_audio.asp

      这篇关于如何发挥多个声音文件在一个网页? (点击最佳实践)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆