Edit in JSFiddle

(function($) {
    $.fn.rollover = function() {
        //preload images
        var preloaderContainer = $("<div>").css("visibility", "hidden").appendTo($(document.body));
        this.find("img[rollover]").each(function(index) {
            var preloaderImg = $("<img>").attr("src", $(this).attr("src"));
            preloaderContainer.append(preloaderImg);
        }).mouseover(function(evt) {
            //mouse over
            $(this).attr("originalSrc", $(this).attr("src"));
            $(this).attr("src", $(this).attr("rollover"));
            //mouse out
            $(this).mouseout(function() {
                $(this).unbind("mouseout");
                $(this).attr("src", $(this).attr("originalSrc"));
            });
        });
    };
})(jQuery);


$(function() {
    $("#tiles").rollover();
});
<div id="tiles">
        <img rollover="http://harouny.files.wordpress.com/2012/06/6822663635_0c7b63d93b_s
.jpg?w=75" class="tileImg" width="150" src="http://harouny.files.wordpress.com/2012/06/6695416525_301f85d7c5_s.jpg?w=75" />
        <img rollover="http://harouny.files.wordpress.com/2012/06/6701144739_15f9663b9e_s.jpg?w=75" class="tileImg" width="150" src="http://harouny.files.wordpress.com/2012/06/6846565247_5371b6bcd5_s.jpg?w=75" />
        
    </div>