Product Rollover Effect?

QVS · #1 10-19-2005, 06:26 AM

http://www.weckonline.nl/weckonline/home.php?cat=277

I want to try and recreate the effect this shop has when you put the cursor over the product. Not nessecerly after the pink colour, but more just the actual effect.

tried searching through the forum to see if anyone else has done this, and cant find anything....so any help or advice would be greatly appreciated.

many thanks.

balinor · #2 10-19-2005, 07:02 AM

That link doesn't seem to work...

QVS · #3 10-19-2005, 09:05 AM

works fine for me...

try this one.. http://www.weckonline.nl/home.php?cat=287

works using IE or Firefox

balinor · #4 10-19-2005, 09:10 AM

Must have been down earlier. That is just simple css. Simply set the :hover class of that table cell to be a different background color.

neaisha · #5 12-02-2006, 05:20 PM

bon soir! can some give me a little more detail on how to achieve this? i'm not sure if i'm supposed to be editing the skin1.css and if so, what? or the products_t.tpl directly

this is the first post i found relating to it, hopefully there's another...

neaisha · #6 12-02-2006, 05:40 PM

I'm assuming I'm to edit - PListCell

Thing is, I kinda wanted rollover to alternate. Is this possible or too in-depth for a novice?

neaisha · #7 12-02-2006, 06:41 PM

I found a possible solution here http://www.hypergurl.com/tablehighlight.html

I put the <head> script in between {literal} tags.in the home.tpl

I then put the table script to product_t.tpl.

It won't work

Any suggestions?

neaisha · #8 12-02-2006, 06:54 PM

WOO HOO FOUND ONE. Sorry to bore those of you who are genius but maybe this will help other bewildered...

customer/main/product_t.tpl

added - <td width="{$width}%" class="PListCell"

onmouseover="style.backgroundColor='#84DFC1';"
onmouseout="style.backgroundColor='#84C1DF'">

http://www.basictips.com/table-cell-background-colors-change-mouseover-css.shtml

sohaibkhan · #9 12-05-2006, 05:50 PM

could you step by step how you do it.

thanks

neaisha · #10 12-06-2006, 11:13 AM

Skin1
-Customer
-Main
-products_t.tpl (if you have set your appearance in admin to display 2-3 columns). If not, you'd edit the products.tpl file for 1 column display.

Look for this line <td width="{$width}%" class="PListCell"...

and add the above code (changing the colors to whatever you want) behind it.

that should do it.