我正在构建一个页面,其中将显示我的 Youtube 视频 channel 视频。
这是我的代码的样子。
显示视频时,它们位于我的 CSS/Javascript 菜单上方。
我尝试了 z-index 和 position:relative 但没有用。在堆栈溢出时,我发现了另一个解决方案 http://youtubelink最后 &wmode=opaque 但它没有帮助。
也许有人可以给我一个正确的解决方案。谢谢。
代码
<div style="width:190px; float:left; margin:0 20px 20px 0;">
<?php if($item->type == 0) { // If video type is Youtube ?>
<p class="video"><iframe width="190" height="142" src="<?php echo $item->link; ?>" frameborder="0" allowfullscreen></iframe></p>
<p class="video-title"><?php echo $item->title; ?></p>
<?php if(!empty($item->desc)) { ?>
<div class="video-desc"><?php echo $item->desc; ?></div>
<?php } ?>
更新:
我将此代码包含在 <head>
中标签
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function () {
//<object id='SWFUpload_0'><param name='wmode' value=transparent></param></object>
$('object#SWFUpload_0>param[name=wmode]').attr("value","transparent");
//<!--[if IE]><object id='SWFUpload_0'><embed name='wmode' value=transparent></embed><![endif]-->
if(!$.browser.msie)$('object#SWFUpload_0').append('<embed wmode="transparent">');
});
</script>
但没有任何改变。
最佳答案
我想我找到了这个问题的解决方案 here .
它涉及将 ?wmode=transparent
放在视频 URL 中。
所以如果 i-frame 代码是:
<iframe title=”YouTube video player” width=”525″ height=”325″ src=”http://www.youtube.com/embed/ucowE8dtNqM” frameborder=”0″ allowfullscreen></iframe>
如下所示:
<iframe title=”YouTube video player” width=”525″ height=”325″ src=”http://www.youtube.com/embed/ucowE8dtNqM?wmode=transparent” frameborder=”0″ allowfullscreen></iframe>
这仅适用于简单的 YouTube iFrame 网址,没有任何额外参数。对于带有额外参数的 URL,添加 &wmode=transparent
所以如果i-frame代码是:
<iframe title=”YouTube video player” width=”525″ height=”325″ src=”http://www.youtube.com/embed/ucowE8dtNqM?rel=0&hd=1″ frameborder=”0″ allowfullscreen></iframe>
如下所示:
<iframe title=”YouTube video player” width=”525″ height=”325″ src=”http://www.youtube.com/embed/ucowE8dtNqM?rel=0&hd=1&wmode=transparent” frameborder=”0″ allowfullscreen></iframe>
或者为了安全起见替换符号:
<iframe title=”YouTube video player” width=”525″ height=”325″ src=”http://www.youtube.com/embed/ucowE8dtNqM?rel=0&hd=1&wmode=transparent” frameborder=”0″ allowfullscreen></iframe>
关于flash - Youtube 视频漂浮在我的菜单上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8603794/