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 и размещена в рубрике Программирование.
Вы можете перейти в конец страницы и оставить ваш комментарий.
Мало букафф? Читайте есчо !
Август 28, 2021 г.
Сниппет кода, демонстрирующий как alias создаётся в Drupal 9.
Ранее (в 8й версии) это был сервис ядра path.alias_storage, и код выглядел так:
[crayon-6a0d76c762101792896939/]
В 9й версии хранилище перенесли в entityTypeManager и потому выглядит ...
Читать
Июль 13, 2023 г.
Кнопка выводится как элемент product.variations, а вот настройки полей, которые выводятся в этой сущности довольно глубоко зарыты.
[crayon-6a0d76c7622fc273127440/]
Поле "кол-во товара в корзине" не является частью сущности product variation, ...
Читать
Апрель 27, 2019 г.
Довольно удобно и просто удалять лишние параметры на этапе обработки запроса Varnish, если вы используете его на вашем веб сервере. Давайте посмотрим как это делается.
Описанное ниже выполнялось для Varnish версии 4.
Допустим вам нужно избавиться ...
Читать
Январь 14, 2025 г.
Когда вы проектируете макет активити в android studio вы можете у корневого контейнера задать цвет фона выбрав соответствующее значение атрибута android:background.
Как в примере ниже - черный фон
[crayon-6a0d76c76259c127820207/]
Это будет ...
Читать