$(document).ready(
  function(){
	$(".rollover").each(
      function(index) {
        $(this).wrap("<div id='rollover-image-" + index + "' class='rollover-image'></div>");
        var a = $(this);
        var wrap = a.parent(".rollover-image");
        var img = a.children("img");
        a.css("display", "block");
        a.css("margin", "0");
        a.css("padding", "0");
        a.css("vertical-align", "top");
        a.css("overflow", "hidden");
        a.css("outline", "none");
        img.css("border", "none");
        img.css("margin", "0");
        img.css("padding", "0");
        img.css("vertical-align", "top");
        
        var src_off = img.attr("src");
        var src_on = src_off.replace(/\.(jpg|jpeg|gif|png)$/i, "_on.$1");
        a.css("background", "url(" + src_on + ") no-repeat 0 0");
        wrap.css("background", "url(" + src_off + ") no-repeat 0 0");
        
            wrap.css("width", img.width());
            wrap.css("height", img.height());
            a.css("width", img.width());
            a.css("height", img.height());

        img.load(
          function() {
            wrap.css("width", img.width());
            wrap.css("height", img.height());
            a.css("width", img.width());
            a.css("height", img.height());

          }
        );

		a.mouseover(
          function() {
            a.css("text-indent", "-9999px");
		  }
        );
		a.mouseout(
          function() {
            a.css("text-indent", "0");
		  }
        );
	  }
    );
  }
);

/*
$(document).ready(
  function(){
	$(".rollover").each(
      function(index) {
        $(this).wrap("<div id='rollover-image-" + index + "'></div>");
        $(this).css("display", "block");
        $("#rollover-image-" + index).css("width", $("#rollover-image-" + index + " img").width());
        $("#rollover-image-" + index).css("height", $("#rollover-image-" + index + " img").height());
        $("#rollover-image-" + index + " img").css("border", "none");
        var src = $("#rollover-image-" + index + " img").attr("src");
        src = src.replace(/\.(jpg|jpeg|gif|png)$/i, "_on.$1");
        $("#rollover-image-" + index).css("background", "url(" + src + ") no-repeat 0 0");
	  }
    );
  }
);
  */

/*
$(document).ready(
  function(){
	$(".rollover").each(
      function(index) {
		$(this).mouseover(
          function() {
			var src = $(this).attr("src");
			$(this).attr("src", src.replace(/\.(jpg|jpeg|gif|png)$/i, "_on.$1"));
            $(this).css("corsor", "pointer");
		  }
        );
		$(this).mouseout(
          function() {
			var src = $(this).attr("src");
			$(this).attr("src", src.replace(/_on\.(jpg|jpeg|gif|png)$/i, ".$1"));
		  }
        );
	  }
    );
  }
);
*/