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, 2020 г.
Как получить полный список зарегистрированных типов публикаций в Drupal 7. Задача типична для бек-енда при создании форм страниц настроек. Потому покажу в статье пример реализации поля для формы с выбором типов публикаций.
В API Drupal существует ...
Читать
Январь 28, 2016 г.
Многие не задумываются при работе в PHP со стандартными функциями даты-времени о диапазоне их применимости (date(), time(), mktime() и т.п). Так мы можем скоро столкнуться с проблемой, подобная которой случалась уже раньше - "ошибка 2000". Я прекрасно ...
Читать
Февраль 12, 2017 г.
Если при отправке запроса через CURL по https, вы получаете следующую ошибку:
[crayon-699e585d4f74f084577217/]
То можно отключить соответствующие проверки, выключив в опциях следующие флаги -SSL_VERIFYHOST, SSL_VERIFYPEER.
[crayon-699e585d4f755943116919/] ...
Читать
Август 15, 2016 г.
Задача поиска и замены каких либо терминов в тексте кажется на первый взгляд довольно простой в PHP. Есть очень мощные инструменты вроде str_replace, а также поиск и замена с помощью регулярных выражений, например, preg_replace и preg_replace_callback. ...
Читать