mouseoverImgReplace.js

// Lade erst wenn Dokument und Elemente ready
jQuery(function() {
	// Für alle Bilder mit der Klasse .person-img...
	jQuery('.person-img').each( function( image ) {
		// Bilder preload im Hintergrund
		imageObj = new Image();
		imageObj.src = jQuery(this).attr('src').replace(/_flat/g, '_pic');
	
		// Mouseover Funktionsbinding
		jQuery(this).live('mouseover', function() {
			// Ersetze src des Bildes mit anderem Bild
			jQuery(this).attr('src', jQuery(this).attr('src').replace(/_flat/g, '_pic'));
			// Mache das gleiche mit dem srcset (responsive Bilder)
			jQuery(this).attr('srcset', jQuery(this).attr('srcset').replace(/_flat/g, '_pic'));
		});
		// MouseOut Funktionsbinding
		jQuery(this).live('mouseout', function() {
			// Ersetze src des Bildes mit Original Bild
			jQuery(this).attr('src', jQuery(this).attr('src').replace(/_pic/g, '_flat'));
			// Mache das gleiche mit dem srcset (responsive Bilder)
			jQuery(this).attr('srcset', jQuery(this).attr('srcset').replace(/_pic/g, '_flat'));
		} );
	});
});