Jquery 是一个常用的 JavaScript 库，它能够帮助我们实现许多比较复杂的交互效果。本文将介绍如何使用 Jquery 实现页面滚动时显示图片的效果。

$(window).scroll(function(){
// 获取滚动距离
var scrollHeight = $(window).scrollTop();
// 获取窗口高度
var windowHeight = $(window).height();
// 遍历所有图片标签
$("img").each(function(){
// 如果图片距离文档顶部的距离小于滚动距离加窗口高度
if($(this).offset().top< scrollHeight + windowHeight){
// 修改图片的 src 属性
$(this).attr("src", $(this).attr("data-src"));
}
});
});

首先，我们用 Jquery 监听窗口滚动事件。在滚动事件回调函数中，首先获取窗口滚动距离和窗口高度，然后遍历所有图片标签。如果图片距离文档顶部的距离小于滚动距离加窗口高度，说明该图片已经进入了窗口可视区域，那么我们把图片的 src 属性修改为 data-src 属性，这样图片就会被加载显示了。

接下来，我们在 HTML 中给需要被延迟加载的图片标签设置 data-src 属性，将需要加载的图片的地址赋值给该属性。当图片进入可视区后，我们就把该属性的值赋给图片的 src 属性，这样图片就会被加载显示了。

通过使用 Jquery 的滚动事件，我们可以轻松地实现页面滚动时显示图片的效果。这种方式能够极大地提升页面加载速度，同时也能够减少网络请求的次数，提高页面交互体验。