Jquery UI + Shadowbox = IE messy behaviour ...

Jquery UI + Shadowbox = IE messy behaviour ...

Hi community,

I'm having quite some trouble using UI inside a shadowbox.
First, here's how I generated my shadowbox
  1.     var options = {
            success:    function(data) {
                var typeAdresseLivraison = $("input.destinationLivraison:checked").val();
                $.ajax({
                    cache: false,
                    url: "/actions/recupererModeleEntete?typeAdresseLivraison="+typeAdresseLivraison,
                    success: function(reponseEntete){
                        data = reponseEntete + data;
                        Shadowbox.open({
                            content:    data,
                            player:     "html",
                            title:      "",
                            height:     800,
                            width:      800
                            });
                    }
                });
            }
        };
        $('#formulaireUploadFichier').live('submit',function() {
            $(this).ajaxSubmit(options);
            return false;
        });





















As you can see, ajax success calls a second ajax request that gets inceremnted with the first result. The final data gets passed to the shadowbox function as pure html data, and is displayed in it.

While using Firefox, behaviour is just fine (but is that really a surprise ...), but, checking it all in IE, draggables just don't seem to inherit jquery's UI natural "draggable" behaviour.

Here's the source code for the entire iframe :
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">

    <head>
        <script type="text/javascript" src="/js/jquery/jquery-1.4.1.min.js?time=<%=System.currentTimeMillis()%>"></script>
        <script type="text/javascript" src="/js/jquery/jquery.UI/jquery-ui-1.7.2.custom.min.js?time=<%=System.currentTimeMillis()%>"></script>
        
        
        <script type="text/javascript" src="/js/fonctionsPro.js?time=<%=System.currentTimeMillis()%>"></script>
        <link href="/css/dragAndDrop.css" rel="stylesheet" type="text/css"/>
        <script type="text/javascript">
        $(function() {
            $(".dragAndDrop").draggable({
                revert: 'invalid'
            });
            $(".droppable").each(function(e){
                var id = $(this).attr("id");
                $(this).droppable({            
                    over: function(event, ui) {},
                    drop: function(event, ui) {},
                    out: function(event, ui) {}
                });    
            })
        });
        </script>

        
    </head>
    <body>



























  2. ...
  3. </body>
  4. </html>
What could I be doing wrong that Firefox correctly interprets and IE not ?