Узнать высоту блока, и добавить класс, как реализовать?

Question

[Василь Бойко]

Есть меню:
Суть задачи такова:
Когда пункты меню не помещаются в одну строчку, то есть вот так:

Нужно добавить класс к меню, например 'mobile-menu'. Когда пункты меню в одной строчке, то его высота 36px
Я это понимаю так:
Если высоту блока больше, чем 36px, то выполнить какое-то действие, в данном случае addClass('mobile-menu')
Но дело в том, что моих знаний в области JS недостаточно.

Если объяснил плохо и лаконично то простите)

Answer 1

[Сергей Зеленский]

Вам не нужен js гуглите адаптивная верстка.
Решение в лоб - у контейнера меню не задавать фиксированную высоту, тогда при смешении пунктов меню он растянется

Comments

[Василь Бойко]

Если не разбираетесь - не советуйте) без обид

[Сергей Зеленский]

научитесь излагать свою речь правильно, а потом уже учите других и делайте замечания

Answer 2

[Vlad Tytcky]

window.onresize=function(){
  if(someDiv.style.height>36){
    someDiv.classList.add('some-class');
  }
}

но для этой проблемы совершенно не нужен js, нужна адаптивная верстка

Answer 3

[metaf]

Вообще, я бы считала не высоту, а выстроила все пункты в один ряд (display: inline-block; white-space: nowrap или display:table-cell), а потом считала, длиннее ли меню контейнера и добавляла ему класс. Опираться на высоту сломанного меню это как-то... странно...
В любом случае, есть небольшие библиотеки а-ля медиа-запросы для элемента, а не вьюпорта: elementqueries.com . Возможно, это вам подойдет. Потому что если делать через js самостоятельно, то нужно будет вешать триггер на ресайз и всё такое прочее, что несколько усложнит вам задачу.