Jquery .height () противоречивые результаты на странице перезагрузки

Question

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

Однако, если страница перезагружается, функции .height () и .outerHeight () возвращают значения, отличные от первоначальных. Они также возвращают различные значения в зависимости от браузера, даже если высота явно указана во внешней таблице стилей.

$(document).ready(function(){

var headingSize = 2*($('div.title').outerHeight(true) + $('div.hint').outerHeight(true));
var adjHeight = $('#image img').height() + 70;
var rowCount = $('div#options ul li').length;
var rowHeight = $('div#options ul li a').height();

var padding = (((adjHeight - headingSize) / rowCount) - rowHeight)/2;

if(padding < 4){
 padding = 4;
}

var margin = (rowHeight + 2*padding)/2;

if(margin < 10){
 margin = 10;
}

$('div.options').css({'marginTop': margin});
$('div#options ul li a').css({'paddingTop' : padding, 'paddingBottom' : padding});  

});

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

Спасибо!

-fucla

Answer 1

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

Удалил включенный файл и все работает отлично и денди.