////////////////////////////////////////
// Rollover using JQuery
PEPS = {};
PEPS.rollover =
{
  init: function() {
    this.preload();
    jq(".ro").mouseover( function () { 
      targetElem = jq(this).attr('imgtarget'); 
      if (targetElem) {
	jq('#' + targetElem).attr( 'src', PEPS.rollover.newimage(jq(this).attr('src')) ); 					
      } else {
	jq(this).attr( 'src', PEPS.rollover.newimage(jq(this).attr('src')) ); 
      }
    });
    jq(".ro").mouseout( function () { 
      targetElem = jq(this).attr('imgtarget');
      if (targetElem) {
	jq('#' + targetElem).attr( 'src', PEPS.rollover.oldimage(jq(this).attr('src')) ); 					
      } else {					
	jq(this).attr( 'src', PEPS.rollover.oldimage(jq(this).attr('src')) ); 
      }
    });
  },
  preload: function() {
    jq(window).bind('load', function() { 
      jq('.ro').each( function( key, elm ) { 
	jq('<img>').attr( 'src', PEPS.rollover.newimage( jq(this).attr('src') ) ); 
      }); 
    });
  },
  newimage: function( src ) {
    return src.substring( 0, src.search(/(\.[a-z]+)$/) ) + '-on' + src.match(/(\.[a-z]+)$/)[0];
  },
  oldimage: function( src ) {
    return src.replace(/-on\./, '.');
  }
};