Как подогнать изображение под размер экрана?
Поскольку люди постоянно пишут «экран», явно не отдавая себе отчёт в том, что это такое, приходится описывать 2 поведения. Тем не менее, для любого из них сначала необходимо посчитать соотношение ширины изображения к его высоте — ratio.
1) Действительно экран
Для этого для контейнера, в котором находится изображение, потребуется применить полноэкранный режим.
Считаем ratio для экранаscreen.width / screen.height
2) Область просмотра браузера (viewport)
Для контейнера потребуется position:fixed для простоты (или position:absolute + подсчёты положения).
Считаем ratio для viewportdocument.documentElement.clientWidth / document.documentElement.clientHeight
А теперь осталось сравнить ratio изображения и ratio области для контейнера. Если первое больше — изображение 100% по ширине, а сверху и снизу должны быть полосы. Если же ratio изображения меньше, то полосы слева и справа, а изображение имеет 100% по высоте.
Про то, как располагать изображение по центру, написано миллион и больше статей.
автору нужно почитать статью
А эмитацию cover Я делаю так.index-page .video {
position: absolute;
left: 0;
top: 0;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -1;
}function makeup() {
		var $video = $('.index-page video');
		if($window.width() < $video.width()) {
			$video.css({
				marginLeft: -($video.width()-$window.width())/2
			});
		}
	}

	$window.ready(function(){
		makeup();
	});

	$window.resize(function(event) {
		makeup();
	});