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 и размещена в рубрике Программирование.
Вы можете перейти в конец страницы и оставить ваш комментарий.
Мало букафф? Читайте есчо !
Ноябрь 19, 2019 г.
При создании расписаний, календарей, и т.п. могут возникать задачи вроде - получить timestamp первого дня этого месяца, или последнего дня следующего и т.п.
В лоб это решается вот так:
[crayon-6acc52602b6ec015792343/]
Со следующим месяцем ...
Читать
Январь 8, 2018 г.
Привычный в PHP и SQL тип данных timestamp отсутствует в javascript. Стоит ли говорить, что timestamp удобен для сравнения дат и для простых вычислений. Как получить его значение в JS?
В Javascript есть класс для работы с датами.
[crayon-6acc52602b7f5787294339/] ...
Читать
Сентябрь 9, 2012 г.
При разработке собственного модуля удобно начинать не с чистого листа, а типового черновика. Можно сразу же сосредоточиться на написании полезного кода, а не рыскать по мануалам и чужим модулям, выискивая реализации типовых секций вроде инсталляции / ...
Читать
Сентябрь 18, 2025 г.
Столкнулся с задачей на практике - в архиве tar.gz лежит еще один архив, в котором еще один и так далее... Как с кощеевым яйцом, только цепочка в матрешке куда более длинная.
Написал небольшой скрипт для bash, по распаковке такого сюрприза.
...
Читать