因此,我需要在网站上嵌入youtube视频,并希望它占据用户屏幕尺寸的80%。我发现以下代码使其全屏显示。有人可以帮助我将其全屏显示为-20%吗?
$(function(){
$('#video').css({ width: $(window).innerWidth() + 'px', height: $(window).innerHeight() + 'px' });
$(window).resize(function(){
$('#video').css({ width: $(window).innerWidth() + 'px', height: $(window).innerHeight() + 'px' });
});
});
答案 0 :(得分:0)
我认为您的宽度在哪里:$(window).innerWidth() + 'px'
...您是说让宽度为页面的整个高度,与高度相同。
能否将$(window).innerWidth()
除以一定的大小,例如300?
这可能会为您改变视频的大小。
例如:
var smallerWidthWindow = window.innerHeight / 250; //(or required number)
然后使用这些变量来更改高度和宽度。
$('#video').css({ width: smallerWidthWindow, height: smallerHeightWindow });
答案 1 :(得分:0)
将height
的{{1}}和window
乘以0.8
,以得到全屏宽度和高度的80%。
$(function(){
$('#video').css({ width: $(window).innerWidth()*0.8 + 'px', height: $(window).innerHeight()*0.8 + 'px' });
$(window).resize(function(){
$('#video').css({ width: $(window).innerWidth()*0.8 + 'px', height: $(window).innerHeight()*0.8 + 'px' });
});
});