Problem with scriptaculous opacity effect on IE

JavaScript
1

Hi,

I want to show a few products, (3 columns x 2 rows), when user clicks some links (LINK 1, LINK 2, LINK 3), these productos change for another six.
To show new products, I´m using scriptaculous opacity effect.
Everything works correctly on firefox and chrome, but on IE it shows 1 column x 6 rows.

You can see it here:
http://www.lomospain.com/tienda/test_test.php

Any idea what I´m doing wrong?
maybe there is an easy way for doing it?

thanks very much for your help

2

perhaps add a fixed width to each div:
as IE cant read the width of each ul’s parent divs.
width: 161px;

3

it didn´t work :frowning:

any other idea?

thanks very much for your help

4

Is it floating? perhaps change them from block elements to inline-blocks.

5

I have 3 divs, capa_1, capa_2 and capa_3

dependind wich div I want to show, I hide one and show another

hide the old one
document.getElementById(“capa_”+capa_seleccionada).style.display=“none”;

show the new one
document.getElementById(“capa_”+capa).style.display=“block”;

must I change it?

thanks

6

try:
document.getElementById(“capa_”+capa).style.display=“inline-block”;

7

still not working

with this change, now on firefox it works the samen that IE
maybe it´s the correct way?

thanks

8

on each of these lines, you have missing quote marks:

<div id=“2_1” style=“opacity:0.0;filter:alpha(opacity=0)” width: 161px;
You may want to do this:
<div id=“2_1” style=“opacity:0.0;filter:alpha(opacity=0)width:161px”;

9

Also, I noticed you added it to the wrong element:

Should be like this:

<div class=“thumb” id=“capa_1” style=“display: block;”>
<div id=“1_0” style=“display:inline-block;width:161px”>

…etc

10

it works now!
you are a genius man!

I´ve been trying it for one week, I was desperated.

Thanks very much for your time and your help.

11

no problem
glad it finally works for you