Question

因此，我需要在网站上嵌入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' });
  });
});

Answer 1

我认为您的宽度在哪里：$(window).innerWidth() + 'px' ...您是说让宽度为页面的整个高度，与高度相同。

能否将$(window).innerWidth()除以一定的大小，例如300？这可能会为您改变视频的大小。

例如：

var smallerWidthWindow = window.innerHeight / 250; //(or required number)

然后使用这些变量来更改高度和宽度。

$('#video').css({ width: smallerWidthWindow, height: smallerHeightWindow });

Answer 2

将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' });
  });
});

无法弄清楚如何在javascript中更改数学

2 个答案: