Problème d'affichage avec mon slideshow

Bonjour,

Je voudrais afficher mes image. Je les récupéré avec ajax.
Ensuite je voudrais les afficher dans une zone de ligntshow.
Mais malheureusement il ne s'affiche pas. Je ne vois pas d’où vient l'erreur.

voici la partie js de mon script

$(document).ready(function(){

    $(".repImage a").click(function(){
        openLight();
        var titre = $(".repImage").text();
        $.ajax({
            url: 'Script/Php/Photo.php',
            type:'POST',
            dataType:'html',
            complete: function(resultat, status) {
                console.log(resultat);
            },
            success: function(codehtml, status) {
                console.log(codehtml);
                $(codehtml).find("#slideShow").appendTo("#zone");
            },
            error: function(resultat, status, err) {
                console.log(err);
            }
        });
        slideShow(); 
        
        function slideShow(){
       	    /*$("#slideShow").css("position","relative");
        	$("#slideShow img").css("position","absolute");*/
        	$("#slideShow img:gt(0)").hide();
        	
        	// Ajout des liens
        	$("#slideShow").append("<p><a href=\"#\" class=\"prev\">Précédente</a> | <a href=\"#\" class=\"next\">Suivante</a></p>");
        	$("#slideShow p").css("padding-top","340px");
        	
        	// Clic sur le lien suivant
        	$("#slideShow a.next").click(function() {
        		var $img_suivante = $("#slideShow img:visible").next("img");
        		if($img_suivante.length<1) $img_suivante = $("#slideShow img:first");
        		$("#slideShow img:visible").fadeOut();
        		$img_suivante.fadeIn();
        	});
        	
        	// Clic sur le lien précédent
        	$("#slideShow a.prev").click(function() {
        		var $img_precedente = $("#slideShow img:visible").prev("img");
        		if($img_precedente.length<1) $img_precedente = $("#slideShow img:last");
        		$("#slideShow img:visible").fadeOut();
        		$img_precedente.fadeIn();	
        	});
        }
        function openLight() {
            $("body").append("<div id=\"zone\"></div>"); 
            $("body").prepend("<div id=\"cache\"></div>");   
            $("#cache").css({
                "width":"100%",
                "height":"100%",
                "background":"black",
                "z-index":"10",
                "position":"absolute",
                "top":"0",
                "left":"0",
                "opacity":0.5
            });
            $("#zone").css({
                "width":"800px",
                "height":"630px",
                "background":"white",
                "z-index":"20",
                "position":"absolute",
                "top":"50%",
                "left":"50%", 
                "padding":"10px",
                "margin-left":"-400px",
                "margin-top":"-301px"
            });
        }
        
        function closeLight(){
            $("#slideShow img").remove();
            $("#zone,#cache").remove();
        }
    });
});

et voici la partie de code php

$sql = new RequestSql(Singleton::getInstance());
$tabImages = $sql->getImages(1);
echo"<div id='slideShow'>";
foreach ($tabImages as $row) {
    echo"<img src='".$row[2]."' alt='".$row[1]."' title='".$row[1]."'>";
}
echo"</div>";

dans la console je remarque que le code php fonctionne et j'arrive a récupérer toute les images se trouvant dans la div slideShow.
Par contre je 'arrive pas a les insérer dans la div zone


Je vous remercie par avance e toute l'aide que vous pourrez m'apporter

Di Blasio Michael
Modifié par dibla (16 May 2011 - 20:47)