webkelder

I changed it again because it didn’t work in IE.

jQuery( document ).ready( function( $ ) {
	// Get the main WC image as a variable
	var wcih_main_imgage = $( 'a.woocommerce-main-image img' ).attr( 'src' );
	// This is what will happen when you hover a product thumb
	$( '.thumbnails a' ).mouseover(
		// Swap out the main image with the thumb

		// if you have the images all in the same size you could use this (with your own imige size) to save some data loading...
		function() {
			var photo_smallsize = $(this).attr('href').replace('.jpg','-583x300.jpg');
			$( '.woocommerce-main-image img' ).attr( 'srcset', photo_smallsize );
			$( '.woocommerce-main-image img' ).attr( 'src', photo_smallsize );
			//window.alert(photo_srcset);
		}

		// ... otherwise use this
		//function() {
			//var photo_fullsize = $( this ).attr( 'href' );
			//$( '.woocommerce-main-image img' ).attr( 'srcset', photo_fullsize );
			//$( '.woocommerce-main-image img' ).attr( 'src', photo_fullsize );
		//}

	);
	$( '.thumbnails a' ).mouseout(
		// Return the main image to the original
		function() {
			$( '.woocommerce-main-image img' ).attr( 'srcset', wcih_main_imgage );
			$( '.woocommerce-main-image img' ).attr( 'src', wcih_main_imgage );
		}
	);
});