在悬停时更改woocommerce产品图片

Question

我希望在用鼠标悬停在任何缩略图上时更改产品图像，然后点击它时，当您移动鼠标时它会停留在那里。

我找到了这段代码，这可能是正确的代码，但我无法弄清楚如何实现它。我想知道如何和/或这是否符合我的预期目的。

// Add to a js file in your theme/child theme or create a new js file. If you create a new file,        remember to enqueue from functions.php. See example below.

// Adds thumbnail hover to main product img
  jQuery(document).on('hover','.thumbnails .zoom', function(){
  var photo_fullsize = jQuery(this).attr('href');
  jQuery('.woocommerce-main-image img').attr('src', photo_fullsize);
 }); 


 // If you dont need to enqueue from functions.php remove the below
  function YourUniqueID_add_enqueue_scripts() {
  wp_enqueue_script( 'theme_js', trailingslashit( get_stylesheet_directory_uri() ) .    'js/theme.js',       array( 'jquery' ) );
}
add_action( 'wp_enqueue_scripts', 'YourUniqueID_add_enqueue_scripts' );