Hi all,

I've detailed this problem before but had no suggestions as I think my
description was too drawn out. I will try and be more concise this
time as I'm still having the problem and I'm getting really frustrated
with it.

I've uploaded a working example of the problem to: http://iol.ie/~jtol/fxslide/

If you clock the 'contact' button in IE6 or IE7 the content that
slides out (fx.slide) will float above the entire menu content on the
left, rendering it unuseable. It works fine in Firefox and Safari.

This problem has been detailed as a bug in IE that incorrectly
overflows content that has been a position of 'relative'. All the
solutions are not working for me as they seem specific to simpler
basic html and css pages that don't involve javascript or mootools. I
believe the problem lies in an additional 'wrapper' div that fx.slide
adds outside the sliding content. One suggestion mentioned I should
not use the default wrapper and try and create my own that I can style
and so work around the bug. I attempted to do so by changing the
following:

<div id="sliderwindow">&nbsp;</div>



to:

<div id ="newwrapper">
<div id="sliderwindow">&nbsp;</div>
</div>



and in my javascript I tried adding a wrapper option to fx.slide to
point to this new div:

var mySlide = new Fx.Slide('sliderwindow',{wait: false, duration:
1000, mode: 'horizontal', wrapper: 'newwrapper'});



But firebug is showing me that there's still a regular default 'div'
wrapper around the sliderwindow and not a 'newwrapper', so the wrapper
is not working. Of course, the wrapper may not be the cause of my
problems but it's my only lead so far. Any suggestions? Thanks.

Reply via email to