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

PEPS = {};

PEPS.rollover =
        {
        	init: function() {
        		this.preload();

        		$(".ro").hover(
                 function() { $(this).attr('src', PEPS.rollover.newimage($(this).attr('src'))); },
                 function() { $(this).attr('src', PEPS.rollover.oldimage($(this).attr('src'))); }
              );
        	},

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

        	newimage: function(src) {
        		return src.replace('_off', '_on');
        	},

        	oldimage: function(src) {
        		return src.replace('_on', '_off');
        	}
        };