Something strange with animate and IE (all versions)

Something strange with animate and IE (all versions)

Hi,
I'm new on the forum and also using JQuery, came to this Framework thru ZendFramework....

My problème is that i've done an animation that works fine on all browsers (Firefox, Opera, Chrome, Safari) but not on any IE ?

Here is the JS code :
  1. var timeSequence = 10000;
    var stat = 1;
    var letter = 0;
    var caption = "";
    var standby;

    function showCaption(obj) {
        caption = obj.attr('rel');
        if(caption)
            type();
    }

    function type() {
        $('.caption').html(caption.substr(0, letter++));
        if(letter < caption.length+1)
            setTimeout("type()", 25);
        else {
            letter = 0;
            caption = "";
        }
    }

    function setElements(){
        $('.elements li:first').addClass("current");
        $(".divFirst").html($('.elements li:first').html());
        $(".divFirst p").animate({'padding':'10px 7px','height': 90},800);
        $(".divFirst p").addClass("caption");
        $(".divFirst img").fadeIn(300);
        showCaption($(".divFirst img"));
        setInterval('slideShow()', timeSequence);
    }


    function slideShow(){

        var current = ($('.elements li.current')?  $('.elements li.current') : $('.elements li:first'));
        var next = (current.next().length)? current.next() : $('.elements li:first');
        var content = next.html();

        if(stat){
            $(".divFirst img").fadeOut(500,
               function(){
                   $(".divFirst").animate({
                       "left": -700},
                       1200,
                       function(){
                           $(".divSecond").html(content).animate({"top": -200},
                               1200,
                               function(){
                                    $(".divSecond p").animate({'padding':'10px 7px','height':90},800);
                                    $(".divFirst p").addClass("caption");
                                    $(".divSecond p").addClass("caption");
                                    $(".divSecond img").fadeIn(200);
                                    current.removeClass();
                                    next.addClass("current");
                                    showCaption($(".divSecond img"));
                                });
                       });

               });

        }else{
            $(".divSecond img").fadeOut(500,
                function(){
                    $(".divSecond").animate({
                        "top": -400},
                        1200,
                        function(){
                             $(this).css('top', 0);
                             $(".divFirst").html(content).animate({
                                   "left": 0},
                                   1200,
                                   function(){
                                       $(".divFirst p").animate({'padding':'10px 7px','height':90},800);
                                       $(".divSecond p").addClass("caption");
                                       $(".divFirst p").addClass("caption");
                                       $(".divFirst img").fadeIn(200);
                                       current.removeClass();
                                       next.addClass("current");
                                       showCaption($(".divFirst img"));
                                   });
                         } );
                });
        }
        stat = !stat;
    }

    $(document).ready(function(){
        $(document).load(setElements());
    });



























































































And the html :
  1. <div id="sliderContainer">

        <div class="divFirst"></div>
        <div class="divSecond"></div>

        <ul class="elements">
            <li>

                <div class="left"><h1>www.artfin.fr</h1><p></p></div>
                <img src="img/artfin_pres.png" rel="Vel supra et falsa vel germanitate adsidua leviter Hannibaliano male per saevientis cruoris paulatim accesserat sibi discentes filio temporis leviter filio regi leviter turgida addere iunxerat humani temporis Augusti et." onclick="displayElement('artfin')" />
            </li>
            <li>
                <div class="left"><h1>www.hotelkodjeue.com</h1><p></p></div>
                <img src="img/hotelkodjeue_pres.png" rel="Post hanc adclinis Libano monti Phoenice, regio plena gratiarum et venustatis, urbibus decorata magnis et pulchris; in quibus amoenitate celebritateque nominum Tyros excellit, Sidon et Berytus isdemque pares Emissa et Damascus saeculis condita priscis." onclick="displayElement('hotelkodjeue')" />
            </li>
            <li>

                <div class="left"><h1>www.skishopmercantour.com</h1><p></p></div>
                <img src="img/skishopmercantour_pres.png" rel="Ibi victu recreati et quiete, postquam abierat timor, vicos opulentos adorti equestrium adventu cohortium, quae casu propinquabant, nec resistere planitie porrecta conati digressi sunt retroque concedentes omne iuventutis robur relictum in sedibus acciverunt." onclick="displayElement('skishopmercantour')" />
            </li>
            <li>
                <div class="left"><h1>www.classic-boats-art.com</h1><p></p></div>
                <img src="img/classicboatsart_pres.png" rel="Post haec indumentum regale quaerebatur et ministris fucandae purpurae tortis confessisque pectoralem tuniculam sine manicis textam, Maras nomine quidam inductus est ut appellant Christiani diaconus, cuius prolatae litterae." onclick="displayElement('classicboatsart')" />
            </li>
            <li>

                <div class="left"><h1>www.villasrikandi.com</h1><p></p></div>
                <img src="img/villasrikandi_pres.png" rel="Fieri, inquam, Triari, nullo pacto potest, ut non dicas, quid non probes eius, a quo dissentias. quid enim me prohiberet Epicureum esse, si probarem, quae ille diceret? cum praesertim illa perdiscere ludus esset." onclick="displayElement('villasrikandi')" />
            </li>
        </ul>
    </div>






























For the online example :http://ortigue.david.free.fr/test

When i use the debugger on IE8, tels me :

Argument non valide.  Line 12 of jquery-1.3.2.min.js
and hightlight this part :
... I.runtimeStyle.left=I.currentStyle.left;;E.left=L||0L=E.pixelLeft+"px";E.left=H;I.runtimeStyle.left=K}}}}return L .... of the line

Tried to play with css ....did'nt get it ?
Thx for your help

Dede