解决优酷、腾讯视频分享iframe高度宽度不能自适应的方法!

由于以前的优酷视频不稳定,开始将以前的视频切换到腾讯视频。


但是代码复制过来后,高度只有150px,无法正常显示,如果将宽度和高度设置固定值之后,移动端则不能自适应,出现错位问题。


后来寻找各种方法,终于找到了解决方案。


<iframe frameborder="0" src="https://v.qq.com/txp/iframe/player.html?vid=i0158izjzsj" allowfullscreen="true"  id="video" width="100%" "></iframe>


在页面加上代码

<script type="text/javascript">document.getElementById("video").style.height=document.getElementById("video").scrollWidth*0.8+"px"</script>


需要注意的是视频自适应大小代码里的 


.getElementById("video")

在复制视频分享代码的时候也要在iframe 加上


id="video"