亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

Chrome 本機圖像延遲加載僅在 iframe 內有效

Chrome 本機圖像延遲加載僅在 iframe 內有效

滄海一幻覺 2023-12-11 10:12:06
Chrome 81、FF 75(今天最新)在 Chrome 中,本機圖像延遲加載僅在 iframe 內起作用。為什么?在 FF 效果很好page1.htm(延遲加載在 Chrome 中不起作用,但在 FF 中運行良好):<p style="margin-bottom: 1000px;">Please scroll down. The image is below the viewport.</p><p style="margin-bottom: 1000px;">Please scroll down. The image is below the viewport.</p><img src="https://wallpaperplay.com/walls/full/5/e/a/218959.jpg" loading="lazy">page2.htm(通過 iframe 進行延遲加載在 Chrome 和 FF 中均有效):<iframe src="page1.htm">這是Chrome的bug嗎?在FF中效果很好(您可以通過滾動和開發者工具 -> 網絡檢查圖像延遲加載)
查看完整描述

2 回答

?
喵喔喔

TA貢獻1735條經驗 獲得超5個贊

我遇到了同樣的問題,但只有當圖像足夠接近視口時才會出現。否則它會被延遲加載。


請嘗試在 Chrome 中打開這個最小的工作示例,然后慢慢向下滾動頁面。當視口大約位于頁面中間時,將加載圖像。


<html>

    <head>

        <style>

            .dummy {

                height: 700vh;

            }

        </style>

    </head>

    <body>

        <div class="dummy"></div>

        <img src="https://yasminfinch.com/wp-content/uploads/2015/03/Hello-icon-300x212.jpg" loading="lazy">

    </body>

</html>

如果沒有信心,我可以認為這是一個功能,而不是一個錯誤。某種優化。例如,當用戶足夠快地向上/向下滾動時,它會減少看到圖像正在加載的機會。


查看完整回答
反對 回復 2023-12-11
?
PIPIONE

TA貢獻1829條經驗 獲得超9個贊

就我而言,我必須width在內聯或在 CSS 文件中顯式設置屬性。

其實你可以嘗試一下原來的demo。如果您在此演示中刪除寬度和高度屬性,則 Chrome 上的延遲加載將不起作用。


查看完整回答
反對 回復 2023-12-11
  • 2 回答
  • 0 關注
  • 164 瀏覽

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號