可以使用以下代码实现图片预加载功能：
function preloadImages(imgSrcs) {
var images = [];
for (var i = 0; i < imgSrcs.length; i++) {
images[i] = new Image();
images[i].src = imgSrcs[i];
}
}
// 使用方式
var images = ['image1.jpg', 'image2.jpg', 'image3.jpg'];
preloadImages(images);
该代码会在页面加载之前，逐个创建图片对象并加载图片资源。在需要用到这些图片时，可以直接使用已经缓存好的图片对象，提高了用户的使用体验。
这个过程不会影响页面的加载速度，因为这些图片是在网页加载之前异步加载的。
为了提高预加载效果，可以考虑使用一定的延迟加载机制，即在页面加载之后一段时间再开始预加载，这样可以避免页面加载时的卡顿，也不会影响用户的使用体验。
同时，也需要注意图片资源的大小和数量，可以通过对图片压缩和限制数量来控制预加载的资源开销。