6

我有一个非常简单的网站，其中包含一个 html5 视频和一个 html5 音频，可以通过两个简单的按钮打开和关闭。音频在 Safari 中一切正常，但在 Chrome 中不起作用。

我的网站是 www.rossfraser.co（不是 .com）

我的音频代码是这样的：

<div align="center">
<audio>
  <source src="audio/site-jingle.mp3" type="audio/mpeg">
</audio>
</div>

<audio id="player" src="audio/site-jingle.mp3" type="audio/mpeg" loop></audio>
<div style="text-align:center">
    <button onclick="document.getElementById('player').play()">JINGLE</button>
    <button onclick="document.getElementById('player').pause()">NO JINGLE</button>
</div>

任何帮助将不胜感激。谢谢！

4

4 回答 4

4

我想我有解决办法。192kbps 的 MP3 不起作用。

128 的 MP3 很好用！！！

于 2013-12-13T17:59:58.160 回答
3

首先看：如果没有java脚本冲突。在我的情况下 jquery.mini.js 是冲突的。

对我来说最好的跨浏览器支持是buzz.js：

<script src="buzz.js"></script>
<script>
var sound;
$(function() {
sound = new buzz.sound( "media/yourfilename", {
    formats: ['ogg', 'mp3']
}).setVolume(100).play();

$('#pause').click(function() {
    sound.pause();
});
$('#play').click(function() {
    sound.play();
    });
});    
</script>

对于按钮使用这个：

<button id="pause">Pause</button>
<button id="play">Play</button>

或者

<audio controls id="a1" preload="auto" autoplay  src="media/page1"></audio>
于 2014-07-12T11:05:50.367 回答
3

我认为谷歌浏览器有一些反对下划线的东西。在我的歌曲文件中取出下划线完全解决了问题

首先，我有 2 个独立的 HTML5 音频播放器，我希望在我的网页上播放 2 首歌曲。一个歌曲文件有下划线，而一个歌曲文件没有。

我的第一步是听从 hectorme85 的建议，将我的 .mp3 和 .ogg 比特率更改为 128kpbs。有同样的问题，除了下划线的歌曲。此时，我还没有意识到没有下划线的解决方案。然后我的第二步是切换.ogg和.mp3的顺序，让.ogg排在第一位。尽管如此，下划线的歌曲还是没有用——而没有下划线的歌曲也奏效了。

最后，我在标记中非常仔细地查看了两首歌曲的差异。就在那时它击中了我。“我可能需要删除歌曲文件的下划线。” 所以我做到了，然后 BAM .. 我的音频在 Chrome 中为我工作。

于 2014-04-07T00:01:36.090 回答
0

我在 Ubuntu 12.04 上遇到了同样的问题（无法在 mac/win 上尝试）

我通过切换到 ogg 来解决问题，它在 firefox 和 chrome 上都能完美运行。

我尝试播放具有不同比特率、单声道、质量选项的 mp3，但没有机会 :(

在我看来问题是由编解码器问题引起的。对我来说，它也解释了为什么 Firefox 一直坚持不使用 mp3。

于 2013-11-19T23:57:36.850 回答