HTML5音频播放器在iOS Chrome＆amp;苹果浏览器

Question

我有一个html5 / jquery / php音频播放器在桌面浏览器上工作正常但是当我在iOS上测试时 - 我看到的只是一个灰色的轨道栏 - 我相信控件隐藏在轨道栏后面因为我可以随机点击它有时会开始播放相关文件。

echo '<div class="' . $audioplayer . '" style="display: none;margin: 0 0 0 0 !important;">';
echo '<audio controls="controls">';
echo '<source src="/journeychurch/media/' . $audiofile . '.wav" type="audio/wav">';
echo 'Your browser does not support the audio element.';
echo '</audio>';
echo '</div>';

echo '<script>';
echo 'var ' . $audiobtn . ' = "' . $audiobtn . '";';
echo 'var ' . $audioplayer . ' = "' . $audioplayer . '";';
echo '$(".' . $audiobtn . '").click(function(){';
echo '$(".' . $audioplayer . '").slideToggle("slow");';
echo '});';
echo '</script>';

现场演示在这里：http://idevhunter.com/journeychurch/sermons

Answer 1

正如我们所看到的，您的问题出在CSS展示风格上。音频组件隐藏在元素上。尝试更改音频元素和父母的填充或边距大小。