Как показать/спрятать кнопку в зависимости от контента?

Question

[Ilaj Osmanov]

От чего нужно отталкиваться, чтобы показать кнопку "Показать все", если контента больше чем указано в в диве?
Например: если контента мало ( не пересекает красную черту ), то кнопки не должно быть и наоборот

Answer 1

[Степан Крапивин]

По количеству букв в блоках, считая пробелы

Comments

[Stalker_RED]

Мне кажется, или буквы, вроде как, бывают разной ширины? Или моноширинные шрифты использовать?

[Степан Крапивин]

да, буквы разной ширины. Но и на картинке не все блоки ровно с правого края и количество блоков везде разное. Даже если использовать моноширинные шрифты в любом случае количество блоков будет разное.
Заметьте, что количество букв в блоках "Марка" и в блоке "Двигатель" одинаковое - 19, а длины самих блоков разное. Так что ровно сделать не получится какие шрифты не используй.

Answer 2

[Stalker_RED]

Если у родительского элемента стоит overflow: hidden, то проверить помещаются ли дочерние элементы можно так:

if (element.offsetHeight < element.scrollHeight ||
    element.offsetWidth < element.scrollWidth) {
    // не помещаются, добавляем кнопку "показать все" 
}

Answer 3

[Алексей Бурлака]

Определить ширину родителя, посчитать сумму из ширины каждого ребёнка и сравнить