iframe有时会出现并且不会消失

Question

我正在为我的朋友乐队组合a quick webpage我想要隐藏的多个嵌入式youtube iframe（使用jquery）。

问题在于（通常至少在chrome / windows上）iframe将出现在左上角，就像它们绝对位于左上角一样。在javascript控制台中，我可以输入$("*").hide();，一切都会消失，但不会消失。

问题似乎与隐藏包含div（$(".details").css("display","none");）的iframe的时间有关。

这是我的代码。单击上面的链接以获取完整的工作示例。

     $(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);
        }); 
    });

非常感谢任何建议/帮助。

Answer 1

不能为每个用户点击延迟加载iframe而不是在页面加载时预先加载所有内容吗？

喜欢在每个链接上绑定点击侦听器并将iframe src属性设置为相应的YouTube链接吗？

例如：

为了这个例子，lemme假设你的html中有10个youtube URL和相应的10个锚点。

为什么不为每个视频加载单独的iframe，为什么不保留单个iframe，其src属性会根据用户点击的链接而改变。

$('a.youtubelinks').click(function(event){
    $('iframe').attr('src', $(event.target).attr('src'));
});

奖励：您可以以编程方式点击列表中的第一个链接，以便列表中的第一个视频将设置为ifram src

$('link1').click();