所以,我想知道这种方法是否可以用jQuery实现,如果是这样的话,任何可以指导我解决这个问题的方法都会很棒。
我正在创建一个固定窗口的Web应用程序(即没有浏览器滚动,主页焦点不需要滚动,对于需要它的项目,它们具有可滚动的div),所以有特定的宽度/高度的比例。在这种情况下,比例是16:9。其中的所有元素都是百分比,基本上所有元素都来自最外层的容器。我需要我的外部容器根据浏览器窗口的大小进行响应。我希望我可以使用jQuery。
虽然大多数响应式设计只关注宽度,但我需要确保宽度和高度都起作用。实际上,根据屏幕大小/浏览器窗口,高度可能是决定因素。
需要采取两种方法,它们取决于浏览器窗口的宽高比。
如果比例大于16:9或1.78(即16:8或2),我需要外部容器的高度与浏览器窗口的高度和外部容器的宽度相匹配然后根据那个高度(即身高* 1.78)。
如果比例小于16:9或1.78(即16:10或1.6),我不能采取上述方法,因为高度* 1.78将导致外部容器太宽而不能浏览器窗口。因此,我需要在这种情况下使用宽度,然后使用它来基于高度(即宽度/ 1.78)。
我的CSS的其余部分应该跟随它的百分比,然后我会有一个完全响应的容器,可以根据浏览器窗口大小进行扩展。
我真的不确定如何处理这个问题,但至少想知道是否有可能。考虑到我可以在我的头脑中处理if / else语句,看起来是这样,但我对jQuery并不是非常好,并希望在解决之前得到一些建议。谢谢!