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 и размещена в рубрике Программирование.
Вы можете перейти в конец страницы и оставить ваш комментарий.
Мало букафф? Читайте есчо !
Апрель 6, 2021 г.
У меня эта задача возникла при работе с формами, где формы содержат поля '#entity' и '#entity_type'. Нужно было найти универсальный способ прочитать ID объекта, т.к. для каждого объекта имя этого поля может отличаться (для node - nid, для file - fid и ...
Читать
Май 19, 2020 г.
Задача переадресации пользователя с одного домена на другой возникает весьма часто. Разберем как это выглядит в контексте настроек сайта на веб-сервере на базе Apache.
Задача состоит в том, чтобы все запросы обращенные к домену site1.ru направить ...
Читать
Июль 6, 2016 г.
Для организации мультисайтинга в Drupal 7 можно использовать специальный файл sites.php, содержащий массив перенаправлений. Этот массив задаёт соответствия между запрашиваемыми доменными именами (и др. параметрами http запроса) и конечными папками, содержащими ...
Читать
Апрель 30, 2023 г.
Задача 394 с литкода. Дана строка, где присутствуют группы вроде N[string], нужно раскрыть скобки, повторяя строку внутри скобок N раз. Структуры могут быть вложенными.
Чтобы выработать решение, рассмотрим пример:
[crayon-6a056d35dd41d441774820/] ...
Читать