2012-04-26 3 views
1

Я сделал отдельную часть веб-сайта, который мы загружаем на сайт joomla через iframe, но я хочу настроить высоту контейнера iframe.Неверная высота JQuery при установке ранее

Поэтому я стараюсь, чтобы получить высоту моего HTML со следующим кодом, который работает нормально (вызов это внутри фрейма):

$(document).ready(function() { 
    var height = $(document).height(); 
    alert(height); 
}); 

Высота правильно насторожило на всех страницах.

Проблема возникает, когда я настраиваю высоту контейнера iframe. Когда я использую этот код:

$(document).ready(function() { 
    var height = $(document).height(); 
    alert(height); 
    parent.document.getElementById('blockrandom').style.height = height + 'px'; 
}); 

Теперь высота будет такой же или больше, чем предыдущий рост, поэтому при переходе от страницы с высотой 900px к одному из 500px, высота останется 900px (в предупреждение также). От маленьких до больших работ просто отлично.

Заранее благодарен!

+0

Когда вы используете jquery, вы можете использовать только $ ("# blockrandom"). Height (height); –

+0

Спасибо за ваш вклад, но это не решит проблему, к сожалению, и когда я это сделаю, размер больше не работает. – Mike

ответ

0

Да, я обнаружил, что после того, как высота отрегулирована, использование собственного свойства или jQuery не имеет никакого значения, результирующее значение высоты не отражает новые значения. Поэтому для динамической настройки элементов во время взаимодействия с одной страницей мне до сих пор приходилось прибегать к эвристике для высоты.

В итоге я оцениваю содержимое внутри элемента и создаю приемлемое, если не совершенно точное значение высоты прокси. Например, допустим, у меня есть ящик с оригинальным набором из 22 полей меток.

Когда пользователь настраивает родительские значения или опции, возможно, я в конечном итоге с любым количеством результирующих полей от 0 до полного 22.

Так что, если у меня 10 осталось после некоторого события пользователя, я бегу функцию, подсчитывает видимые элементы и вычисляет высоту. Таким образом, 10 полей x 22 пикселя означают, что я корректирую содержащий элемент до примерно 220 пикселей.

В частности, у меня есть абстрактная функция, в которую я назначаю высоту по умолчанию, базовую высоту (которая позволяет некоторым всегда открывать нерегулируемые элементы, такие как текст/инструкции, что угодно) и множитель высоты элемента.

При загрузке и между событиями я устанавливал контейнер элемента по умолчанию. После подсчета переменных элементов я вычисляю значение, умножая переменные элементы на множитель и добавляя его к базовой высоте.

Пока что это лучшее, что я смог сделать и довольно прост. Используя селектора jQuery, требуется только несколько строк для подсчета и еще пара для вычисления и установки высоты.

NB: Следует отметить, что это необходимо только для элементов, которые автоматически не корректируют их высоту через их содержимое. Самым большим нарушителем этого является вкладка jQuery, в которой, в моем случае, возникает эта проблема. Большинство элементов с относительной высотой без манипуляции автоматически настраивают свое пространство, поскольку элементы переключаются между display = block || none.

Вот несколько примеров коды:

setElemHeight = function(options) { 
    var _elem = options.containerElement; 
    var _nBase = options.nBaseHeight; 
    var _nMltplr = options.nMultiplierHeight; 
    // COUNT ROWS 
    var _nCnt = 0; 
    $('#' + _elem.id + ' div div:first-child > input').each(function() { 
     if(this.style.display != 'none') _nCnt++; 
    }); 
    $(_elem).height(_nBase + (_nCnt * _nMltplr)); 
} 

Я абстрагирован достаточно для моих целей, но вы могли бы взять немного дальше, так что дети селекторных элементы являются динамическими.

Смежные вопросы