在上urbansunsets.com 上,我有一个HTML5音频播放器。 HTML是:
<div class="col-lg-12 col-sm-12">
<div id="radio_player">
<div class="default-player">
<video width="320" height="240" controls id="audio_player">
<source src="http://stream.radio.co/sedf8bacc9/listen" type="audio/mpeg">
</video>
</div>
<div id="audioplayer">
<button id="pButton" class="pause"></button>
<div class="live">Live</div>
<div id="volume_control">
<label id="rngVolume_label" for="rngVolume">
<i class="fa fa-volume-up" aria-hidden="true"></i>
</label>
<input type="range" id="rngVolume" min="0" max="1" step="0.01" value="0.5">
</div>
<div class="current-piece">
<div class="now-playing">Now playing:</div>
<script src="https://public.radio.co/embed/sedf8bacc9/song.js"></script>
</div>
</div>
</div>
</div>
它可以在台式机/笔记本电脑和移动电话上正常运行,但IPhone除外,在iPhone上它可以在设备播放器中打开,而不是在浏览器中播放。这是为什么?可以在浏览器中播放吗?有什么不见了?
谢谢!
最佳答案
<div class="col-lg-12 col-sm-12">
<div id="radio_player">
<div class="default-player">
<audio width="320" height="240" controls id="audio_player">
<source src="http://stream.radio.co/sedf8bacc9/listen" type="audio/mpeg">
</audio>
</div>
<div id="audioplayer">
<button id="pButton" class="pause"></button>
<div class="live">Live</div>
<div id="volume_control">
<label id="rngVolume_label" for="rngVolume">
<i class="fa fa-volume-up" aria-hidden="true"></i>
</label>
<input type="range" id="rngVolume" min="0" max="1" step="0.01" value="0.5">
</div>
<div class="current-piece">
<div class="now-playing">Now playing:</div>
<script src="https://public.radio.co/embed/sedf8bacc9/song.js"></script>
</div>
</div>
</div>
</div>
如果您真的只想要音频,那为什么不尝试使用
<audio>
而不是<video>
呢?可以看到一个iPhone可见的示例on codepen