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 и размещена в рубрике Программирование.
Вы можете перейти в конец страницы и оставить ваш комментарий.
Мало букафф? Читайте есчо !
Ноябрь 5, 2023 г.
Подключение скрипта или стилей "по-месту", на мой взгляд, не плохая практика, т.к. соответствующие файлы не будут подключаться, если в них нет необходимости.
От вас потребуется объявить нужный скрипт и/или стили как библиотеку. Это можно сделать ...
Читать
Июнь 15, 2023 г.
Сложно коротко описать поведение блока, а речь пойдет о sticky позиционировании в css.
Невероятно классная штука position: sticky давно уже существует в спецификации, но пока ощутимая доля интернетчиков пользовалось IE, который не поддерживал значение ...
Читать
Май 24, 2018 г.
После std идет название какой либо функции стандартной библиотеки VCL.
Скорее всего проблема в том, что вы не подключили std в вашей конфигурации (часто встречается при миграции конфигов). Для подключения библиотек в Си используется директива import. ...
Читать
Июнь 28, 2022 г.
Что такое Xamarin - следует почитать отдельно. Вкратце, это платформа с идеологией .NET, позволяет писать код сразу для разных платформ - iOS, Android, Win. Меня интересовала возможность на знакомом языке (C#), написать что либо под Android.
Я ...
Читать