终于解决wordpress插入的优酷视频手机端无法播放的问题

首先,需要在网页模板中增加一段js代码。这个动作也可以在网页加载的最开始做。对于WordPress网站,这段代码可以增加到主题的footer.php的合适位置,代码如下:

<script> vd = document.getElementById(“youku”); if (vd != null) { vd.style.height = vd.scrollWidth*0.6+“px”; } </script>

这段代码的意思很简单,就是找到id为youku的元素,让后将其高设置为宽的60%。这样就实现了优酷视频自动版网页的自适应。

然后,复制优酷视频的通用代码,如下:

<iframe height=498 width=510 src=“http://player.youku.com/embed/XMzAyNzc4ODUyOA==” frameborder=0 allowfullscreen></iframe>

视频代码需修改一下,修改完如下:

<div style=“text-align:center;”> <iframe id=“youku” style=“width:96%” height=498 width=510 src=“http://player.youku.com/embed/XMzAyNzc4ODUyOA==” frameborder=0 allowfullscreen></iframe> </div>

对比一下,可以看出,代码的修改很简单。先对整个iframe实现居中,然后给iframe增加一个id,值为youku,同时给iframe一个width属性值,这是一个百分比,表示占用页面的宽度。

可以测试一下阿柯发布的视频链接页面:http://kzyblog.com/3496.html

打赏

暂无评论

发表评论

电子邮件地址不会被公开。 必填项已用*标注