javascript - 使用 jQuery 在元素上切换类和更改大小

Question

我试图让一个 div 在点击功能上改变它的属性。我通过调用 toggleClass() 更改了一些属性，这很好，而且效果很好。但是我也想根据视口(viewport)的大小调整 div 的大小。为了访问这些数字，我正在使用 jQuery 更改 width 和 height。这个命令看起来像这样:

$('.box').click( function() {
  $(this).toggleClass('box--grow', 0);
  $(this).css('width', w * .9);
  $(this).css('height', h * .9);
});

编辑 我希望高度 和宽度 回到 100%。

我尝试使用 toggle 类，但这导致整个 div 消失，并且此解决方案不起作用，因为当我再次单击 div 时，类被删除但高度相同。

我正在寻找一种方法来切换它或在 css 中获取视口(viewport)宽度。我尝试了这两种方法，但无法得到我正在寻找的任何东西。

Answer 1

为什么不使用 CSS VH 和 VW 值？

CSS:

.my90Class{
   width: 90vw;
   height: 90vh;
}

JS:

$('.box').click( function() {
   $(this).toggleClass("my90Class");
});