У меня есть несколько div'ов, т.е.

После получения высоты окна на

windowHeight = window.innerHeight;

Я хочу управлять высотой div в пропорции к высоте окна, например, div_1 должен быть 30%, div_2 должен быть 45% от высоты окна и т.д. Мне нужно сделать это на javascript / jquery.

Luta V

Ответов: 3

Ответы (3)

Я манипулировал ответом @void, чтобы получить ответ, который я ожидал. Код выглядит следующим образом

$('.div_1').height(windowHeight*30/1400+"em");

Я разделил windowHeight на 1400 вместо 100, потому что шрифт тела составляет 14px, для изменения его из px в em.

В качестве альтернативы можно использовать атрибут jquery & data

Div1
Div2
Div3

Вы можете просто использовать CSS

.div_1 {height:30vh;}

Это установит высоту, равную 30% от высоты области просмотра. vh - это высота области просмотра.

Частично поддерживается в IE > 8 и не поддерживается в Opera, в остальных случаях поддерживается полностью. http://caniuse.com/#feat=viewport-units

Чтобы сделать это в jQuery

$('.div_1').css("height", $(document).height()*30/100+"px"); // Will set its height equal to 30% of that of document.

2022 WebDevInsider