CSS свойство overflow позволяет управлять реакцией контейнера (например, DIV) при его переполнении. В некоторых случаях бывает необходимо определить факт переполнения, чтобы выполнить какие то действия.
Переполнение контейнера наступает, когда его размеры фиксированы. Т.е. мы имеем CSS вида:
|
|
div#test-container { height: 100px; overflow: hidden; } |
Как определить, что содержание контейнера выходит за его пределы, в данном примере имеет высоту более 100 точек?
|
|
//найдем объект var obj = document.getElementById('test-container'); //и вот оно решение: if (obj.scrollHeight > obj.clientHeight) { alert ('Контейнер переполнен'); } |
Аналогично можно проверить переполнение контейнера по ширине.
|
|
if (obj.scrollWidth > obj.clientWidth) .... |
А ещё лучше оформить эти проверки в виде функций:
|
|
function ifOverflowedX(obj) { return obj.scrollWidth > obj.clientWidth; } function ifOverflowedY(obj) { return obj.scrollHeight > obj.clientHeight; } |
Данная запись опубликована в 22.03.2016 22:43 и размещена в рубрике Программирование.
Вы можете перейти в конец страницы и оставить ваш комментарий.
Мало букафф? Читайте есчо !
Ноябрь 13, 2017 г.
Если в коде необходимо проверить авторизовался ли текущий пользователь, то можно использовать как минимум два подхода.
Глобальная переменная user
GLOBALS['user'] в Drupal хранит объект текущего пользователя, расширенного информацией о ролях пользователя. ...
Читать
Май 27, 2025 г.
Если коротко - нельзя.
Вызвать какой метод трейта напрямую без подключения его к классу невозможно, т.к. трейты в PHP не являются самостоятельными сущностями, как классы или объекты.
Трейт — это механизм "вклейки" кода в класс. Он не компилируется ...
Читать
Май 9, 2023 г.
Когда требуется подсчитать количество не нулевых бит в числе, то следуют алгоритму: проверяют четность числа и смещают на каждой итерации на один разряд вправо, пока число не обратится в ноль. Есть и другой алгоритм, который обходится без цикла.
...
Читать
Май 24, 2023 г.
Если у вас собран Drupal + Commerce, то, возможно, при обновлении модуля метатегов возникает ошибка.
Модуль не находит таблицы мета информации для сущности commerce_product и прерывается с выводом сообщения:
[crayon-69ef449a93374334082170/] ...
Читать