0

所以,我想知道 jQuery 是否可以使用这种方法,如果可以,任何可以指导我解决这个问题的方法都会很棒。

我正在创建一个固定窗口的网络应用程序(即没有浏览器滚动,不需要滚动主页焦点,并且对于确实需要它的项目,它们有可滚动的 div),所以有特定的比例宽度/高度。在这种情况下,比率为 16:9。里面的所有元素都是百分比,基本上都来自最外面的容器。我需要我的外部容器根据浏览器窗口的大小做出响应。我希望我可以为此使用 jQuery。

虽然大多数响应式设计只关注宽度,但我需要确保宽度和高度都发挥作用。事实上,根据屏幕大小/浏览器窗口,高度可能是决定因素。

有两种方法需要采用,它们取决于浏览器窗口的纵横比。

  1. 如果比率大于 16:9 或 1.78(即 16:8 或 2),我将需要我的外部容器的高度与浏览器窗口的高度匹配,并且我的外部容器的宽度将基于此高度(即高度 * 1.78)。

  2. 如果比例小于 16:9 或 1.78(即 16:10 或 1.6),我不能采用上述方法,因为高度 * 1.78 会导致外部容器对于浏览器窗口来说太宽。因此,在这种情况下,我需要使用宽度,然后使用它来确定高度(即宽度/1.78)。

我的 CSS 的其余部分也应该效仿,因为它是基于百分比的,然后我将拥有一个响应完美的输出容器,该容器可以根据浏览器窗口大小进行缩放。

我真的不知道如何解决这个问题,但至少想知道它是否可能。考虑到我可以在脑海中处理 if / else 语句,看起来是这样,但我对 jQuery 不是非常好,并且想在处理之前获得一些建议。谢谢!

4

0 回答 0