我正在开发一款 Web 应用程序，但与 Apple 设备和 PC 上的 Safari 浏览器存在兼容性问题。
Html5 音频标签：
<audio controls>
<source src="/audio/en/file.mp3" type="audio/mpeg">
<source src="/audio/en/file.ogg" type="audio/ogg">
Your browser does not support the audio element.
</audio>
- 我只想用基本控件播放音频文件。
- 之前的代码在 Chrome、Opera、Firefox 上完美运行（Windows 和 Android 设备).
- But 控制器没有出现 with Safari (在 PC、iPad 和 iPad mini 上使用最新版本进行了测试).
- 音频播放器有灰色背景只有“播放/暂停”功能.
- 这是描述我的问题的屏幕截图：
Thanks.
我有完全相同的问题。
我的解决方案：我添加了音频文件源的完整 URL。不知道为什么，但它有所不同。这是我的完整代码。 CSS修改只是为了隐藏下载按钮。但当我把它拿出来时，我看不到时间线。很奇怪，但这段代码对我来说确实有效。
<!DOCTYPE html>
<html>
<head>
<title>html5 audio player on iPhone</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
audio::-internal-media-controls-download-button {
display:none;
}
audio::-webkit-media-controls-enclosure {
overflow:hidden;
}
audio::-webkit-media-controls-panel {
width: calc(100% + 33px);
}
</style>
</head>
<body>
<audio controls preload="auto" style="width:100%;">
<source src="https://example.com/audio/audiofile.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio><br />
</body>
</html>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
