Hover over product images and they change

General General Questions
1

How can I implement a code I the product gallery page where when I hover over a product, it changes the image shown to another version of that product?



I'm trying to show other colours of clothes I have and wondered if this was possible in cs cart



Thanks

2

I just did this myself. I did this on a page but you can use the product description as well.

Insert image then with the “insert/edit image” box still open click on “advanced” tab and check"Alternative Image" and fill in the “For Mouse Over/out” boxes with image url's.

Mouse over box = new image

mouse out box = original image



I made the image size of the mouse out larger so that it becomes a close up of my product.

3

To make the image larger you could also use the “transform: scale(x,y)” CSS class. There is no additional image with this method.

I just added this to my CSS so the logo bulges a little on mouse over:

.logo-container a:hover {transform: scale(1.05,1.05);}

4

HI JIMMY OD,



thanks for the reply, just one thing, where would i go to start that process? as ive been in product descriptions etc and cannot find where you are talking about?



thanks again

5

I will try to show a pic.







You will find this in the products description area.



[attachment=6946:imageedit.jpg]



Then this



[attachment=6947:imageedit2.jpg]

imageedit.jpg

imageedit2.jpg