javascript - 当图像进入浏览器的可见部分时使图像加载?

标签 javascript jquery ajax image

<分区>

我在浏览网页时看到了一些我以前从未见过的东西。 在这个网站上: http://blogof.francescomugnai.com/2009/04/mega-roundup-of-geektool-scripts-inspiration-gallery/

当您向下导航页面时,图像仅在浏览器的可见部分加载。 我以前从未见过这种情况,想知道是否还有其他人见过这种情况,以及具体如何做到这一点。

我猜这是某种 Wordpress 插件(他正在使用的插件),但我不确定。 是javascript吗?它们实际上是在页面加载时加载,但只是在稍后变得可见以产生“时髦”效果,或者这实际上对加快页面加载时间有用吗?

最佳答案

"wp-content/plugins/jquery-image-lazy-loading"

Lazy loader is a jQuery plugin written in JavaScript. It delays loading of images in (long) web pages. Images outside of viewport (visible part of web page) wont be loaded before user scrolls to them. This is opposite of image preloading.

Using lazy load on long web pages containing many large images makes the page load faster. Browser will be in ready state after loading visible images. In some cases it can also help to reduce server load.

http://www.appelsiini.net/projects/lazyload

所以它似乎遍历了指定的每个图像或元素上下文内部的每个图像,并在图像完全加载之前用占位符 gif 替换 src,保存原始 URI,当图像“可见”时它替换占位符与真实图像。

关于javascript - 当图像进入浏览器的可见部分时使图像加载?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1736215/

相关文章:

javascript - 在 JavaScript 运行时让 CSS 动画流畅?

javascript - 如何根据变量显示一定数量的输入字段?

jquery - 如何从 jQuery 'body' 单击事件中获取特定元素

javascript - Jquery 点击处理程序两次后不工作

javascript - 底部的 jQuery,等待 <head> 上的执行脚本,直到它被加载

javascript - 如何防止 AJAX 端点上的 DDoS?

javascript - 如何将一个/一个完全定义但自治的 GUI 元素追溯附加到另一个(DOM 附加)元素

javascript - Jquery切换类问题

jquery - 单击后突出显示子菜单

javascript - 单击鼠标后,在进入下一页之前在 div 内运行脚本