gpt4 book ai didi

javascript - 如何在用户将图像滚动到 View 中时动态(或延迟)加载图像

转载 作者:IT王子 更新时间:2023-10-29 02:43:58 26 4
gpt4 key购买 nike

我在许多“现代”网站(例如 facebook 和谷歌图像搜索)中注意到了这一点,其中只有当用户向下滚动页面足以将它们带入可见视口(viewport)区域时才会加载折叠下方的图像(在查看源代码,该页面显示 X<img> 标签,但它们不会立即从服务器获取)。这种技术叫什么,它是如何工作的,它在多少浏览器中工作。是否有一个 jQuery 插件可以用最少的代码实现这种行为。

编辑

奖励:有人可以解释 HTML 元素是否存在“onScrolledIntoView”或类似事件。如果不是,这些插件如何工作?

最佳答案

这里的一些答案是针对无限页面的。 Salman 要求的是延迟加载图像。

Plugin

Demo

编辑:这些插件是如何工作的?

这是一个简化的解释:

  1. 查找窗口大小并查找所有图像的位置及其大小
  2. 如果图片不在窗口大小范围内,则用相同大小的占位符替换它
  3. 当用户向下滚动,并且图像的位置 < 滚动 + 窗口高度时,加载图像

关于javascript - 如何在用户将图像滚动到 View 中时动态(或延迟)加载图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5117421/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com