Change mouseover/hover to onmouseclick

On the product page I have the option to show more than 1 image. So I added a couple. These are displayed as small images underneath the main image. Now if you hover over these small images, they appear as the main image, very nice. But I would like to change this into: when you click the small image, it appears. Reason: on touch-devices you can't hover..

I know I should ask one question but on the same subject: I have a responsive (100%) artisteer template. These small images below the main image change into large images if you look on like an iphone. They become as large as the main image and that looks weird..

Thanks!

Hi,

Edit the view "product / show_block_img" and replace the line:

echo $this->image->display($image->file_path, 'hikashop_main_image'.$variant_name, $image->file_name, 'class="hikashop_child_image"','', $width,  $height);

					$link = $this->image->display($image->file_path, 'hikashop_main_image'.$variant_name, $image->file_name, 'class="hikashop_child_image"','', $width,  $height);
					$pattern = '/onclick/';
					$replace = '';
					$link = preg_replace($pattern,$replace, $link);
					$pattern = '/onmouseover/';
					$replace = 'onclick';
					$link = preg_replace($pattern,$replace, $link);
					echo $link;

Worked like a champ!

Thanks!