zblogPHP插入优酷（iframe框架）等视频，手机端自适应宽度方法

zblogPHP模板在插入优酷等第三方视频的时候，一般使用框架iframe或者embed，但现有的优酷 爱奇艺等网站的分享代码，其中都有高宽限制，插入网页后，在PC端内容区宽度足够是正常显示的，但在手机移动端访问的时候，就会出现视频显示不全，过大的情况！

下面分享一个解决优酷视频自适应的问题：

<iframe width="510" height="498" src="http://player.youku.com/embed/XMjc2Mjg1NDU4OA==" frameborder="0"></iframe>

代码中一般都有宽高

方法一：

每次插入视频代码的时候，都手动删除掉其中的width和height，然后通过CSS去定义iframe的宽和高，包括手机端的！

这种方法每次必须要删除宽高，可以用，但不如方法二。

方法二：

通过jquery移除width（宽度） height（高度）

//视频自适应    function video_ok(){        $('.article-content embed, .article-content video, .article-content iframe').each(function(){            var w = $(this).attr('width'),                h = $(this).attr('height')            if( h ){                $(this).css('height', $(this).width()/(w/h))            }        })    }

然后再通过CSS去写宽高：

<style>.page-view-article-content embed, .page-view-article-content video, .page-view-article-content iframe{width: 510px;height: 498px;}/*PC上正常显示宽度*/@media screen and (max-width:980px){ /*宽度低于980px时候执行*/.page-view-article-content embed, .page-view-article-content video, .page-view-article-content iframe{max-width: 100%;height: 200px;}/*宽度低于980px时候，iframe宽度100%，高度200px*/}</style>

如此，即可解决！