#jquery #html #iframe #onload
#jquery #HTML #iframe #загрузка
Вопрос:
Я создаю быструю веб-страницу для моей группы друзей с несколькими встроенными iframes youtube, которые я хочу сначала скрыть (с помощью jquery).
Проблема в том, что часто (по крайней мере, в chrome / Windows) фреймы iframe отображаются в верхнем левом углу, как если бы они были расположены абсолютно в верхнем левом углу. Затем я могу ввести в консоли javascript $("*").hide(); , и все исчезнет, но не iframes.
Проблема, похоже, связана с тем, что я скрываю iframes, содержащие divs ( $(".details").css("display","none"); ).
Вот мой код. Нажмите на ссылку выше для получения полного рабочего примера.
$(document).ready(function() {
$(".details").css("display","none");
$("a.date").click(function() {
$(this).parent().children("div").toggle('slow');
$(document.body).animate({
'scrollTop': $(this).offset().top
}, 2000);
});
});
Любой совет / помощь были бы высоко оценены.
Комментарии:
1. Вы устранили проблему? Потому что я не могу увидеть, в чем проблема на странице, на которую вы ссылаетесь. Просматривается как в fox, так и в chrome. Единственное, что я заметил, это то, что загрузка страницы заняла много времени.
2. нет, он все еще там… Время загрузки, вероятно, связано с 9 iframes youtube, которые я открываю…
3. Работает как по волшебству, или я что-то пропустил. :S
4. Отлично работает здесь, на Arch Linux / Chromium.
5. Честно говоря, я понятия не имею, что не так. Хотя я поделюсь некоторыми наблюдениями. Если вы развернете каждую дату одну за другой сверху вниз [не сворачивая их обратно], то через некоторое время вы увидите, что страница отображается нормально. Попробуйте отобразить страницу только с одним видео в каждом разделе date. Это может дать некоторую подсказку…
Ответ №1:
Не можете ли вы лениво загружать iframe для каждого клика пользователя вместо предварительной загрузки всего при загрузке страницы?
Например, привязать прослушиватель кликов к каждой ссылке и установить атрибут iframe src для соответствующей ссылки YouTube?
Например:
Ради этого примера предположим, что у вас есть 10 URL-адресов YouTube и, соответственно, 10 якорей в вашем html.
Вместо того, чтобы загружать отдельный iframe для каждого видео, почему бы вам не сохранить один iframe, атрибут src которого меняется в зависимости от того, по какой ссылке нажимает пользователь.
$('a.youtubelinks').click(function(event){
$('iframe').attr('src', $(event.target).attr('src'));
});
БОНУС: Вы можете программно щелкнуть первую ссылку в вашем списке, чтобы первое видео в списке было установлено как iframe src
$('link1').click();