将优酷视频嵌入网站时需要指定长和宽的像素,这对手机等终端十分不友好。因此我们可以用javascript让优酷的视频自适应屏幕。

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

以上为一段优酷提供的视频,需要指定长和宽,其实,我们可以用javascript获取屏幕的宽度,再乘以相应的比率,从而让视频自适应屏幕大小。

先给iframe制定一个id video 然后加入以下代码:

<script>  
		window.onresize=Init;  
		function Init(){
			document.getElementById("video").width=""+document.body.clientWidth*0.8+"";
			document.getElementById("video").height=""+document.body.clientWidth*0.45+"";
			} 
</script>

即可自适应屏幕尺寸。