У нас есть некоторый код JavaScript, который изменяет размеры элементов <div/> (корректирует высоту / ширину / отступы / поля и т. Д.) В зависимости от размеров родительского элемента <div/>, в частности высоты и ширины родительского элемента, который мы используем врасчет.Высота и ширина родительского элемента определяется во внешнем файле CSS, и <link> используется для включения таблицы стилей в раздел <head> страницы.Все таблицы стилей включены перед javascript.Код изменения размера JavaScript запускается внутри события готовности документа jQuery с использованием стандарта $(function() {}).Ко всем таблицам стилей и javascripts автоматически добавляются временные метки (приложение Rails), чтобы гарантировать, что они не кэшируются (в разработке).
В Firefox 3.6 изменение размера работает каждый раз.Однако в Safari 5 иногда изменение размера завершается неудачей, потому что родительская высота / ширина неверна, что, по-видимому, связано с тем, что таблица стилей не загружалась до JavaScript.К сожалению, это происходит каждые несколько раз и отличается в зависимости от загрузки браузера / компьютера.Я могу поместить код изменения размера в setTimeout() и задержать его примерно на 1 секунду или около того, чтобы заставить его работать надежно, но это не выполнимое решение, потому что оно слишком медленное и все еще зависит от машины.В идеале должен быть способ гарантировать , чтобы таблица стилей была загружена, а затем запустить код изменения размера JS.
Прежде всего, это плохой дизайн, когда изменение размера JS на основе CSS загружается из внешней таблицы стилей?Я подумываю о том, чтобы попытаться разместить высоту и ширину встроенными, чтобы они отображались с сервера, но это требует значительного изменения кода приложения и более тесной связи с пользовательским интерфейсом, и я хотел бы по возможности избежать встроенного стиля.Случайно ли происходит событие webkit при загрузке таблиц стилей?Я не думаю, что есть.Какие-нибудь предложения относительно метода кроме тайм-аута, чтобы гарантировать, что все таблицы стилей загружены перед запуском JavaScript?Кто-нибудь еще испытывал различия в порядке и времени загрузки таблиц стилей между Webkit и другими браузерами, и есть решение, которым можно поделиться?Я мог бы по-новому взглянуть на эту проблему.
Примечание: в целом для изображений мы используем событие load ($(thing).load(fn(){})) для изображений, чтобы убедиться, что они загружаются перед применением к ним любого JavaScript.Это было бы хорошим примером для подражания, если бы такая вещь существовала.Спасибо!