Change image and display image

I have a site using BigCommerce that has a function on the product page that displays some thumbnails. When the user clicks on the thumbnail, he shows some description of this image and also needs to change the main image on the left to a larger version of the selected thumbnail.

The script correctly displays / hides part of the description, but does not replace the main image. I was wondering if anyone could help solve this? Contact BigCommerce, but they say that this is a template problem that they cannot handle.

When checking the web inspector, it says that there is an error of a non-displayable type and that the attribute 'largeimage' for the rel tag is missing. I tried to add this back, but it had no effect.

Thanks.

+4
source share
1 answer

You have a showProductThumbImage() function that expects two arguments, but you only pass one, for example:

 <a onclick="showProductThumbImage(2)" href="#"><img ... /></a> 

The second argument should be a reference to the element ... elsewhere you go through this , so presumably you should do the same here. The function expects the passed element to have a rel attribute containing a JSON string as the value. There are elements on the page that have the rel attribute that looks right:

 <a href="javascript:void(0);" rel='{"gallery": "prodImage", "smallimage": "http://www.kriega.com/product_images/m/322/HY3home__49494_std.jpg", "largeimage": "http://www.kriega.com/product_images/h/328/HY3home__71324_zoom.jpg"}' ><img ... /></a> 

You need to get the rel attribute containing JSON, as described above, in the links that call showProductThumbImage() , and pass this as the second parameter:

 <a onclick="showProductThumbImage(2, this)" href="#" rel='{"gallery": "prodImage", "smallimage": "http://www.kriega.com/product_images/m/322/HY3home__49494_std.jpg", "largeimage": "http://www.kriega.com/product_images/h/328/HY3home__71324_zoom.jpg"}' ><img ... /></a> 
+4
source

All Articles