Jquery, .height () изменяется при обновлении страницы, но не при загрузке - PullRequest
2 голосов
/ 24 ноября 2010

Я уже видел следующую тему:

Проблема загрузки Jquery при первой загрузке / жестком обновлении

Что, кажется, является некоторой обратной версией проблемы I 'Я испытываю.В этом случае проблема заключается в жестком обновлении, в данном случае это решение.

Из-за некоторых проблем при разработке сложного пользовательского интерфейса веб-приложения для работы на мониторах различной высоты я решил обратиться к jQUery, чтобы изменить высоты длямне.Первоначально я использовал процентную высоту, но это приводило к большим промежуткам в точках, а использование максимальной и минимальной высоты оказалось сложным для перетаскивания элементов из контекста.Использование приложения намного медленнее без включенного JavaScript (хотя оно построено на прогрессивном улучшении), поэтому предполагается, что пользователь включит его.Это для тех, кто предложит решение CSS.

Ссылка на тест Это было удалено, так как домен больше не действителен

Проблемаэто то, что когда страница загружается через гиперссылку, она имеет правильный размер - если вы открыли ее, вы должны увидеть это с примерно 30px между нижней частью желтых / зеленых полей и нижней частью браузера.Однако обновите его (вам может понадобиться обновить его несколько раз), и вы увидите, как желтое поле исчезает в нижней части страницы, а зеленое поле растягивается, чтобы присоединиться к нему.Это происходит только в режиме реального времени на моем сервере - я никогда не замечал эту ошибку при разработке на своем локальном хосте, потому что это не происходит.

Код jquery находится в sandpit1.1webservices.co.uk/ground-control/examples / scripts / jumpers.js и конкретный фрагмент:

function loadResize()
{
 //var window=$(window).height();
 var window=$('div.main').height();
 //window=parseInt(window);
 window-=50;
 $('div.staff ul').css('height',window);
 window-=175;
 $('div.loads').css('height',window);
 window-=150;
 $('div.loads div.list').css('height',window);
}

Вы можете видеть, что я прокомментировал несколько вещей, и в самом коде для тестирования есть и другие.Когда в начале тестирования отображается окно с предупреждением о высоте окна, в моем браузере отображается 885 (высота экрана 1024 пикселя), однако при обновлении отображаются случайные значения в диапазоне от 1133 до 1785. Выполните полное обновление или загрузку страницы и возврат к 885. Функция вызываетсяпрямо в конце document.ready:

$(window).resize(loadResize);
loadResize();

Раньше у меня был сам триггер события resize, но он удалялся на случай, если это вызвало проблему.

Есть идеи?

Ответы [ 2 ]

11 голосов
/ 18 сентября 2012

Я в конечном итоге исправил эту проблему, переместив функцию loadResize() из события $(document).ready() в событие $(window).load(). Это правильно, поскольку готовый документ запускается после того, как DOM был создан, но до загрузки дополнительных элементов. По этой причине такие элементы, как изображения и пользовательские шрифты (оба из которых были на странице), влияли на расчеты размера - в зависимости от скорости сети и загруженности в то время для первого события будут заданы разные высоты.

0 голосов
/ 24 ноября 2010

Попробуйте записать это как $ (функция loadresize () {и заканчивается на});

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...