Pjax/Ajax-фрагмент, возвращающий width/offsetWidth 0 при загрузке

Question

Встречаемся с трудной ошибкой с фрагментами Pjax на следующем сайте:

https://dl.dropboxusercontent.com/u/65752410/map.html

В настоящее время, щелкая ссылки "расписание" и "карта" в навигационной панели, вы загружаете фрагменты страницы через Pjax вместе с некоторым условным JavaScript, предоставленным requirejs.

На странице "карта" при загрузке первой страницы будет вычислена ширина каждого элемента с классом .side-panel правильно. Однако последующие загрузки вернут ширину 0, несмотря на то, что выбранный элемент присутствует в DOM, когда запрашивается ширина.

Чтобы воспроизвести ошибку:

1. дождитесь загрузки карты
2. нажмите на ссылку "расписание", чтобы загрузить страницу расписания
3. нажмите на ссылку "карта", чтобы загрузить страницу карты. Ширина каждого .side_panel будет зарегистрирован как 0.

Если вы оставите консоль открытой во время этого теста, вы увидите, что при загрузке страницы регистрируется правильная ширина, страница расписания динамически загружается на втором шаге, а затем страница карты загружается с .side_panel элементы в DOM, но возвращающие ширину 0.

Answer 1

Если вы посмотрите на консоль, панель div не имеет offsetParent, это означает, что он еще не был вставлен в DOM, что будет означать, что ширина будет 0.