It appears that your setStyles is screwing things up. instead of using
<h5> tags, try making the div tags. They will handle the styles your
setting a bit better. Also, the styles are exactly the same, minus the
background image change. You can make the class for that particular
div in your css and just change the background image. It is redundant
code to put the same styles in there twice. Mess around with
removeClass & addClass to get better results.
The best thing to do first is to remove the setStyles altogether to
see if it solves the image overlap issue. Then you will know if that
is the source of your problem.
Another debugging approach is to see if adding opacity: false does
anything. But in my test, it seems to work just fine.
Pépê wrote:
> Hi.
>
> Ive been testing the accordion class but i have compatibility problems
> with firefox and internet explorer 7.
>
> Ive made this code for two elements for testing purposes:
>
> <div id="accordion">
>
> <h5 class="toggler">Edif�cio Semapa</h5>
>
> <div class="element">
>
> <div class="img-dec">
>
> <img src="img/portfolio/media/semapa.jpg"
> width="242" height="161" alt="Edificio Semapa"/>
>
> </div>
> </div>
>
> <h5 class="toggler">Centro E.Mem Martins</h5>
>
> <div class="element">
>
> <div class="img-dec">
>
> <img src="img/portfolio/media/memmartins.jpg"
> width="242" height="161" alt="Centro E.Mem Martins"/>
>
> </div>
>
> </div>
>
> </div>
>
>
> In Firefox, the first element is visible (i can see the title and the
> photo), and the second i can see the title but the image dont, so its
> ok;
>
> In Internet explorer i see both images instead of one....
>
> I tried to add the div class (img-dec) in the accordion instance but
> doesnt work either:
>
>
> var myAccordion = new Accordion($('accordion'), 'h5.toggler',
> 'div.element',{
> onActive: function(toggler,
> element){toggler.setStyles
> ({background: 'url(./img/bg_toggler_on.jpg) no-repeat',padding: '10px
> 0 10px 15px ',color: '#000'});
>
> },onBackground: function(toggler, element){
> toggler.setStyles({
> background: 'url(./img/bg_toggler_off.jpg)
> no-repeat',padding:
> '10px 0 10px 15px ',color: '#000'});}});
>
> You can see what i mean if you visit
> http://www.longavia.pt/alpha/portfolio.php
>
> Please i need some help for this...
