豎屏

橫屏效果

<div class="h5box">? ? ? ? ?
<iframe src="http://player.youku.com/embed/XMTI4MjU5OTA3Mg==" frameborder="0" width="1280px" height="720px"></iframe>
</div>

<script type="text/javascript">if(window.addEventListener){window.addEventListener("load",fixIframe,false);window.addEventListener("resize",fixIframe,false);
}
else{window.attachEvent("onload",fixIframe);window.attachEvent("onresize",fixIframe);
}function fixIframe(){
var box=document.querySelector(".h5box");
var frame=box.querySelector("iframe");
var screenWidth=window.outerWidth||document.documentElement.clientWidth;
var screenHeight=window.outerHeight||document.documentElement.clientHeight;
var movieWidth=parseInt(frame.width||frame.style.width);
var movieHeight=parseInt(frame.height||frame.style.height);
var vScale=screenHeight/movieHeight;
var hScale=screenWidth/movieWidth;var scale=Math.min(vScale,hScale,1);var frameLeft=movieWidth*(scale-1)/2;
var frameTop=movieHeight*(scale-1)/2;frame.style.transform="scale("+scale+")";
frame.style.webkitTransform="scale("+scale+")"; 
frame.style.mozTransform="scale("+scale+")"; 
frame.style.left=frameLeft;
frame.style.top=frameTop;
frame.style.margin="auto";
frame.style.position="relative";box.style.width="100%";
box.style.height=movieHeight*scale;
box.style.overflow="hidden";
box.style.minHeight=movieHeight*scale;
box.style.textAlign="center"; 
}
</script>