I would stay away from the jQuery load event... You dont really want to load anything into the DOM at this point. You just want to make reference of all the images you want to have in cache. I normally approach it like this. On document ready create an empty array, add a new Image object for each image to the array, then assign the 'src' property to the image, and then every image you created in the array will be in your cache. This will work across all browsers... Its been tested.
$(document).ready(function () {
imagesSearchPage = new Array();
imagesSearchPage ["imageTitle01"] = new Image();
imagesSearchPage ["imageTitle01"].src = "images/imageTitle01.png";
imagesSearchPage ["imageTitle02"] = new Image();
imagesSearchPage ["imageTitle02"].src = "images/imageTitle02.png";
imagesSearchPage ["imageTitle03"] = new Image();
imagesSearchPage ["imageTitle03"].src = "images/imageTitle03.png";
});
I usually create a new array for each page just to keep things organized. I know it might seem like a lot of code but all your images will be cached and you can also reference the image from the array if you need to.
Clear your cache, open up your dev tools, click on Network > Images, and you will see the images.
Hope this helps!