Hi all,
the accordion won't work properly in ie6 (works perfectly in ff 3).
the structure:
<div class="container">
        <div id="test-accordion" class="accordion">
                <div class="accordion-item">
                        <div class="accordion-toggle"></div>
                        <div class="accordion-content"></div>
                </div>
                <div class="accordion-item">
                        <div class="accordion-toggle"></div>
                        <div class="accordion-content"></div>
                </div>
                ...
        </div>
</div>
Jquery ver 1.3, ui 1.64c .
I trigger the accordion in this way:

                 jQuery(document).ready(function () {
                                jQuery("#test-accordion").accordion({
                                        header: "div.accordion-toggle",
                                        clearStyle: false,
                                        fillSpace: true
                                });

The problems:
- once clicked in the toggle, the content will show over the other
accordion items - happens mainly if the content is made by images or
mixed text + images.
-overflow will not keeps the contents inside the accordion container
proberly, they will flow out the container.
- when contents are bigger then the container, and the container size
is fixed, the overflow won't work properly. I got a big image, ff
shows scrollbars perfectly, ie just shows the whole image screwing the
whole accordion.
Here what I had to do to kinda fix it, in a .css file visible only by
ie:
div.container{
        float:left;
        width:580px;
        background:#f0f0f0;
        height:450px;
        color:#333333;
        overflow:hidden; /*needed for accordion */
        position:relative;/* needed for accordion */
}
div.accordion-item{
        position:relative; /*needed for accordion */
        overflow:auto; /*needed for accordion */
}
div.accordion-toggle{
        width:100%;
}
div.accordion-content{
        overflow:auto;  /*needed for accordion */
}

Now it works almost like ie, except when the accordion-content
contains a big images (ie crops it while ff shows the scrollbars).

Sample page: www.alu.com/entest/index_test.php (still working on it).

Reply via email to