Attribute Rollovers - By Nineve

**Nineve** · 22 Sep 2010, 05:26 PM

My new mod is ready for download.
Simple 3 step procedure to add a rollover effect for Attributes (in this case to enlarge the thumbnail sized images). Very little altered in the native file of attributes.php and a bit of CSS to add to your stylesheet.

Hope people find it as useful as I have. Enjoy.

**dddmx3** · 26 Sep 2010, 10:58 AM

I love your module!!

But is it possible so that when you hover a different image comes up?

I really really need that option!

**Nineve** · 27 Sep 2010, 03:12 PM

Hi,
Glad you like it. Unfortunately, no, it can not (as configured) open another image. Due to how it was coded (those images are being preloaded) I did not want to further burden the page load time.

You could use an image of your product and just have that enlarge or...

There is another mod you may want to look at given the circumstances of your web site. "Swap Images via MouseOver or Click" will allow you to customize your additional images. That might be a good option for you.

**dddmx3** · 28 Sep 2010, 01:07 AM

Yes but I like the color options and how its placed under the attributes section.

**thomaswhiteeagle** · 5 Nov 2010, 06:08 PM

How does this work? Any examples to show? I have the mod and installed it on 1.3.9f. I thought that if I a product attribute that has images say "choose color" then radio button choices showing the different color swatches (for example) that this mod would if I roll over one of the images pop up a larger version of the image. However it doesn't seem to be working at all is there something I am missing here?

**Nineve** · 5 Nov 2010, 10:19 PM

There is another mod that changes the main image to an attribute image when you select either a radio button option or a pull down menu. This does not work like that. This is just to enlarge the attribute image when you hover over the thumbnail.

**thomaswhiteeagle** · 6 Nov 2010, 06:20 AM

Yes that is my understanding if I have an attribute image that with this mod if someone rolls over the attribute image a larger version of the image will pop up. However I have installed the mod and when I roll over an attribute image on a product listing nothing happens.

**samarac** · 7 Nov 2010, 04:26 AM

I was trying to use this module as well, but it most of the templates come with several css pages. The main, the tm, the stylesheet.css and buttons.css So which one is the css code in the readme file supposed to be inserted into? Additionally, it talks about adjusting the size to 200 px on lines 482-483, but can't seem to find that either. Thanks.

**Waij** · 9 Jan 2011, 03:34 PM

I need this mod too. After installation on 1.3.9h nothing changes.
I have two attributes colour and size. I want to hover over the colour images then get a large image. Did somebody get this to work or can help me with this?.

**ScriptJunkie** · 26 Jan 2011, 05:14 AM

I installed this mod, uploaded my images, and then edited the CSS file to reflect my image sizes.

Issue 1: In Internet Explorer 8, only two of the three attribute thumbnails are displayed, and of those, each is shown twice (side by side as if one image) and is enlarged and fuzzy.

Issue 2: In Firefox 3.6, only two of the three attribute thumbnails are displayed. The third one is represented by text, but no image.

Example

I believe the issue is with the CSS, particularly this section:

Code:

/*currently hidden attribute image*/

a.attribRoll i 
   {
      display:block; 
      position:absolute; 
      left:-9999px; opacity:0;
      -moz-box-shadow: 10px 10px 10px rgba(0, 0, 0, .5);
      -webkit-box-shadow: 10px 10px 10px rgba(0, 0, 0, .5);
      box-shadow: 10px 10px 10px rgba(0, 0, 0, .5);
      -moz-border-radius: 10px;
    
      -webkit-border-radius: 10px;
      border-radius: 10px;
   }

Can you advise on a fix?