CarouFredSel + ajax

Bonjour,

j'ai mis en place sur mon site un carouFredSel qui marche bien. mais je voudrais lorsque l'on clique sur une vignette, chargé un nouveau carouFredSel contenant de nouvelles photos sans recharger la page. J'arrive à mettre en place mon ajax mais il faut cliquer 2 fois sur la vignette pour que carouFredSel fonctionne sinon les images sautent.

code page principale
<script>
$(".loading").css('display',"block")
$(".loading").html('<img src="img/loading/ajax-loader.gif" width="32" height="32" alt="Loading" longdesc="img/loading/ajax-loader.gif" /> Veuillez patienter...');

xhr.open("POST", url, true);

xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)) {
var e = document.getElementById('carrousel');
/*On ajoute le contenu de la réponse dans le Dom du document*/
e.innerHTML ="";
e.innerHTML = xhr.responseText;

var scripts = e.getElementsByTagName('script');
for(var i=0; i < scripts.length;i++)
{
/*Sous IE il faut faire un execScript pour que les fonctions soient définie en globale*/
if (window.execScript)
{
/*On replace les éventuels com' html car IE n'aime pas ça*/
window.execScript(scripts.text.replace('<!--',''));
}
/*Sous les autres navigateurs on fait un window.eval*/
else
{
window.eval(scripts[i].text);
}
}


//$('#diapoRes').trigger('play', true);
$(".loading").css('display',"none");

}
};

xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send(data);
</script>

[b]page php appelée:

avant requête sql + php

<script>

$('#diapoRes').carouFredSel({
responsive: false,
align : 'center',
scroll : {
items: 1
},
auto : {
play: true,
duration: 2000
},
circular: true,
items:1,
next: '#nextDiapo',


});

$("#diapoRes").parent().swipe({
swipeLeft: function() {
$("#diapoRes").trigger("next");
}
});

</script>

merci de votre aide car j'ai beau cherché et laissé des messages sur le site du plugin mais pas de réponse.[/i][/i]