Я действительно прибегал к хитрости, чтобы справиться с этим время от времени. Я разработал виджет полосы прокрутки jQuery, где столкнулся с проблемой, которую я не знаю заранее, является ли прокручиваемый контент частью скрытой части разметки или нет. Вот что я сделал:
// try to grab the height of the elem
if (this.element.height() > 0) {
var scroller_height = this.element.height();
var scroller_width = this.element.width();
// if height is zero, then we're dealing with a hidden element
} else {
var copied_elem = this.element.clone()
.attr("id", false)
.css({visibility:"hidden", display:"block",
position:"absolute"});
$("body").append(copied_elem);
var scroller_height = copied_elem.height();
var scroller_width = copied_elem.width();
copied_elem.remove();
}
По большей части это работает, но есть потенциальная проблема, которая может возникнуть. Если контент, который вы клонируете, стилизован с помощью CSS, который включает в свои правила ссылки на родительскую разметку, клонированный контент не будет содержать соответствующий стиль и, вероятно, будет иметь несколько иные измерения. Чтобы обойти это, вы можете убедиться, что к разметке, которую вы клонируете, применяются правила CSS, которые не включают ссылки на родительскую разметку.
Кроме того, это не подошло для меня с моим виджетом скроллера, но чтобы получить соответствующую высоту клонированного элемента, вам нужно установить ширину равной ширине родительского элемента. В моем случае CSS-ширина всегда применялась к реальному элементу, поэтому мне не пришлось об этом беспокоиться, однако, если к элементу не применена ширина, вам может потребоваться выполнить некоторую рекурсивную процедуру. Обход DOM-элемента элемента для определения ширины соответствующего родительского элемента.