如何在網頁上嵌入YouTube視頻時避免div重疊？

使用兩種方法中嵌入來自YouTube視頻時，iframe：如何在網頁上嵌入YouTube視頻時避免div重疊？

<iframe width="400" height="300" src="http://www.youtube.com/embed/2D_AU8-2QWY?rel=0" frameborder="0" allowfullscreen></iframe>

和舊：

<object width="400" height="300"><param name="movie" value="http://www.youtube.com/v/RNclwz9B_GQ?version=3&amp;hl=it_IT&amp;rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/RNclwz9B_GQ?version=3&amp;hl=it_IT&amp;rel=0" type="application/x-shockwave-flash" width="400" height="300" allowscriptaccess="always" allowfullscreen="true"></embed></object>

我總是剛開我的div一個醜陋的重疊效應，就像這樣：

enter image description here

所以問題是如何避免這種情況？謝謝！

來源

2011-09-05 DomingoSL

你想只是把它放在登錄後面或修復它在頁面上的1點？ – 1ftw1

它必須落後於一切 – DomingoSL

這是否發生在所有瀏覽器或特定瀏覽器中？ –

嘗試在CSS z-index爲了你的div的這種方式，你可以選擇什麼樣的頂上去

https://developer.mozilla.org/en/CSS/z-index

來源

2011-09-05 12:59:23 1ftw1

似乎與z-index無關。注意第三個截圖。疊加窗口小部件通常具有非常高的z-index。 –

的要在1ftw1的答案補充;允許Flash內容設置z-index您需要包括wmode PARAM

從Adobe's site：

wmode - 可能的值：窗口，直接的，不透明的，透明的，GPU。在瀏覽器中設置Flash電影的Window Mode屬性以實現透明度，分層，定位和呈現。如果省略此屬性，則默認值爲「窗口」。有關更多信息，請參閱下面的使用窗口模式（wmode）值。
窗口 - SWF內容在網頁上的自己的矩形（「窗口」）中播放。瀏覽器將確定如何將SWF內容與其他HTML元素進行分層。使用此值，您不能明確指定SWF內容是顯示在頁面上其他HTML元素的上方還是下方。
直接 - 直接使用路徑渲染。這會繞過屏幕緩衝區中的合成並將SWF內容直接呈現到屏幕。建議此wmode值爲內容回放提供最佳性能，並支持硬件加速演示使用舞臺視頻或舞臺3D的SWF內容。
opaque - SWF內容與頁面上的其他HTML元素一起分層。 SWF是不透明的，會隱藏頁面背後的所有內容。與wmode = window或wmode = direct相比，此選項會降低播放性能。
透明 - SWF內容與頁面上的其他HTML元素一起分層。 SWF背景顏色（舞臺顏色）是透明的，SWF下面的HTML元素可通過SWF的任何透明區域進行查看，並進行alpha混合。與wmode = window或wmode = direct相比，此選項會降低播放性能。
gpu - 在某些聯網的電視和移動設備上使用額外的硬件加速。與其他wmode值不同，顯示列表圖形的像素保真度無法保證。否則，該值與wmode = direct類似。

來源

2011-09-05 13:05:15 peirix

bgiframe可能會解決問題。如果你想知道，你需要將bgiframe應用到標題和覆蓋。你也可以看看z-index and iFrames!。

來源

2011-09-05 13:09:06

如何在網頁上嵌入YouTube視頻時避免div重疊？

回答

相關問題