html – 从视口中的图像无加载

发布时间：2020-12-14 18:57:34 所属栏目：资源来源：网络整理

导读：我使用Disqus评论我的Ghost模板,但我有麻烦. Disqus iframe内的图像如果它们不在视口外,不加载. 调试我可以找到：如果我从.surface-container中删除overflow：auto,则出现图像. 如果我从.surface-container中删除高度：100％,则出现图像. 如果您缩小浏览器

我使用Disqus评论我的Ghost模板,但我有麻烦.
Disqus< iframe>内的图像如果它们不在视口外,不加载.

调试我可以找到：

>如果我从.surface-container中删除overflow：auto,则出现图像.
>如果我从.surface-container中删除高度：100％,则出现图像.
>如果您缩小浏览器的图像显示.

但是,如果我删除任何这个属性,抽屉不正常工作,如果您打开抽屉,该网站滚动.

它接缝是浏览器问题,而不是与css相关的问题：/

Fiddle

Real Scenario

解决方法

试试这个：

main {
    overflow: visible;
}
.surface {
    position: absolute;
    top: 0;
    overflow: visible;
    width: 100%;
    height: 100%;
    bottom: 0;
}

更新2：

Fiiddle

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!