horizontal accordion screen flicker

[generic]

1) Script Title: Horizontal Accordion

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...haccordion.htm

3) Describe problem: I'm working with the above mentioned script and it's looking and working well for me (so far) with the exception of an odd screen flicker after sliding the panels around a few times quickly. It happens randomly on firefox and I've yet to single out the definite cause - sometimes it happens right away, sometimes it takes a few minutes to replicate.

You can see the page at http://www.ambercraft.net/saffron/index.php

Any help would be much appreciated!

Thanks in advance,

gen

[ddadmin]

I see the issue, though can't quite tell yet while it's doing that. My guess though is that some of the default styles you've removed from the CSS of the script might be the cause. For example, I noticed you removed the "float:left" property from the default style:

.haccordion li{
margin: 0;
padding: 0;
display: block; /*leave as is*/
width: 100%; /*For users with JS disabled: Width of each content*/
height: 200px; /*For users with JS disabled: Height of each content*/
overflow: hidden; /*leave as is*/
float: left; /*leave as is*/
}

Any reason why you removed it, and what happens when you reinstate it?

[generic]

I changed the float for the layout - I the list floating right and sliding to the left so I adjusted it. That doesn't seem to be the culprit though, when I change it back to default float:left it still flickers.

[generic]

After mucho reading I came on a similar type of problem someone was having using the spry accordions horizontally and based on what I read there, the following seems to work although there is still some issue with little bits of flashing here and there but it's much more doable now.

Is this bad form or should it be fine in the long run:

in haccordion.css:
.haccordion{
height: 319px;
overflow: hidden;}

[ddadmin]

Where you missing "overflow: hidden;" originally in your CSS? That line is necessary, yes. FYI testing your page now I don't get any flashing in FF any longer.

To further tighten the animation effect, you might try replacing all occurrences of:

stop()

with:

stop(true, true)

instead. Unless you notice negative behavior, it's ok to leave the change in place.

[generic]

Thanks for replying. The overflow: hidden was missing but I might have just missed that when I compared. It definitely made the big difference.

Also, I tried the stop(true, true) edit but it reacted oddly; sliding the whole stack of panels from the beginning when one panel was already expanded and you tried to slide a second one.

I am still noticing a flicker although it's much slighter now. Would you have any further suggestions?