隐藏的嵌入src仍占用空间

时间:2012-02-05 22:27:04

标签: audio embed hidden

我有以下嵌入代码:

<embed src="audio/tileSelect.wav" autostart="false" width="1" height="1" hidden="true" id="sound1" enablejavascript="true">
<embed src="audio/tileRemove.wav" autostart="false" width="1" height="1" hidden="true" id="sound2" enablejavascript="true">

虽然这些是隐藏的(我没有看到它们),但它们仍占用空间。如何删除他们使用的额外空间?

我已经尝试将它放在display: none;的div中,但这阻止了我的音频工作。

有什么建议吗?

由于

2 个答案:

答案 0 :(得分:0)

嗯有一个解决方案(虽然不是很漂亮):

.au {
    position: relative; 
    top: -50px; 
    left: -50px; 
    overflow: hidden;
}

把它放在一个div中并给它这些比例

答案 1 :(得分:0)

接受的答案对我不起作用,使用IE7-9时屏幕上仍有间隙。我知道这是一个旧帖子,浏览器已经改变,因为给出了答案。请使用以下代码并将其另存为audio.html并在IE7-10和最新版本的Chrome,Safari和FireFox中运行。您将看到使用IE7-9在屏幕上显示间隙。我正在使用的方法没有。

此外,我在可用时使用 HTML5 <audio> tag ,然后在需要时返回 <embed> tag 。我还没有做过很多研究,但这就是 w3schools currently recommends ,我已经测试了所有主流浏览器和版本,因此截至2014年5月13日,它看起来效果很好对我来说。

希望这有帮助。

(音频可能需要一秒钟才能开始播放,它来自archive.org)

<div style="background-color:lightgray; height:100px; width:300px; padding:5px;">
    This is the solution I am using so that the embed tag doesn't take up any room...<br>
    Audio is embedded below this block.  You will see no gap in any browser.
</div>
<div style="position:absolute; top:0px; left:0px;">
    <audio autoplay>
        <source src="https://archive.org/download/testmp3testfile/mpthreetest.mp3" type="audio/mpeg">
        <embed width="1" height="1" hidden="true" src="https://archive.org/download/testmp3testfile/mpthreetest.mp3">
    </audio>
</div>
<div style="background-color:gray; height:20px; width:300px; padding:5px;">
    Audio is embedded above this block
</div>

<div style="background-color:aqua; height:100px; width:300px; padding:5px; margin-top:30px;">
    Using a div with "position: relative; top: -50px; left: -50px; overflow: hidden;" still gives a gap...<br>
    Audio is embedded below this block.  You will see a gap in IE7-9.
</div>
<div style="position: relative; top: -50px; left: -50px; overflow: hidden;">
    <audio autoplay>
        <source src="https://archive.org/download/testmp3testfile/mpthreetest.mp3" type="audio/mpeg">
        <embed width="1" height="1" hidden="true" src="https://archive.org/download/testmp3testfile/mpthreetest.mp3">
    </audio>
</div>
<div style="background-color:green; height:20px; width:300px; padding:5px;">
    Audio is embedded above this block
</div>