我有一个视频,我想要它填充100％的宽度,和100％的高度.并保持长宽比.
它是否可能至少填补100％？如果有一点视频必须超出屏幕以保持长宽比,那没关系.
HTML：
<video preload="auto" class="videot" id="videot" height="100%" preload>
<source src="BESTANDEN/video/tible.mp4" type="video/mp4" >
<object data="BESTANDEN/video/tible.mp4" height="1080">
<param name="wmode" value="transparent">
<param name="autoplay" value="false" >
<param name="loop" value="false" >
</object>
CSS：
.videof,.videot {
width: 100% !important;
height: 100% !important;
}
解决方法
您可以使用Javascript将高度动态设置为窗口的100％,然后根据视频宽度与窗口宽度的比例,使用负左边距居中.
var $video = $('video'),$window = $(window);
$(window).resize(function(){
var height = $window.height();
$video.css('height',height);
var videoWidth = $video.width(),windowWidth = $window.width(),marginLeftAdjust = (windowWidth - videoWidth) / 2;
$video.css({
'height': height,'marginLeft' : marginLeftAdjust
});
}).resize();
