rollover = {

    init: function() {
        this.preload();
        $('.rollover').rollover();
    },

    preload: function() {
        $(window).bind('load', function() {
            $('.rollover').each(function(key, elm) { $('<img>').attr('src', rollover.high_image($(this).attr('src'))); });
        });
    },

    high_image: function(src) {
        return src.replace(/([_.])low([_.])/, '$1high$2');
    },

    low_image: function(src) {
        return src.replace(/([_.])high([_.])/, '$1low$2');
    }

};

(function($) {
    $.fn.rollover = function() {
        if(!$(this).hasClass('rollover'))
            $(this).addClass('rollover');
        if(!$(this).attr('has_rollover_hover')) {
            $(this).hover(
                function() {
                    if($(this).hasClass('rollover'))
                        $(this).rollover_high();
                },
                function() {
                    if($(this).hasClass('rollover'))
                        $(this).rollover_low();
                }
            );
            $(this).attr('has_rollover_hover', true);
        }
    };
    $.fn.rollover_high = function() {
        $(this).attr('src', rollover.high_image($(this).attr('src')));
    };
    $.fn.rollover_low = function() {
        $(this).attr('src', rollover.low_image($(this).attr('src')));
    };
})(jQuery);

$(document).ready(function() {
   rollover.init();
});