Как определить, находится ли текст скрытого/переполнения сверху или снизу элемента
Я хотел бы расширить ответ на Shog9 в
Как определить из javascript, если элемент html имеет переполненный контент
И я хотел бы знать, находится ли скрытый текст сверху или снизу (или обоих или ни одного) содержащего элемента.
Какой лучший способ сделать это?
Ответы
Ответ 1
Я не мог видеть лес через деревья. Фрагмент кода Joel var isScrolledDown = el.scrollTop > 0;
заставил меня понять, как это сделать. Я использовал две функции:
function HasTopOverflow(el) {
return el.scrollTop;
}
function HasBottomOverflow(el) {
var scrollTop = el.scrollTop,
clientHeight = el.clientHeight,
scrollHeight = Math.max(el.scrollHeight, clientHeight);
return (scrollTop + clientHeight) < scrollHeight;
}
Не тестировали, если он будет работать на IE6 +, но FF работает.
Если есть какие-либо ошибки, сообщите мне.
Ответ 2
Вы можете комбинировать scrollLeft
и scrollTop
с ответом Shog.
В частности:
// Author: Shog9
// Determines if the passed element is overflowing its bounds,
// either vertically or horizontally.
// Will temporarily modify the "overflow" style to detect this
// if necessary.
// Modified to check if the user has scrolled right or down.
function checkOverflow(el)
{
var curOverflow = el.style.overflow;
if ( !curOverflow || curOverflow === "visible" )
el.style.overflow = "hidden";
var isOverflowing = el.clientWidth < el.scrollWidth
|| el.clientHeight < el.scrollHeight;
// check scroll location
var isScrolledRight = el.scrollLeft > 0;
var isScrolledDown = el.scrollTop > 0;
el.style.overflow = curOverflow;
return isOverflowing;
}