Problème de récuperation de données dans un fichier XML avec par Ttvz - page 1

Salut à tous,
Je me suis mis récemment à Jquery et je dois réaliser un slideshow. J'arrive à faire marcher mon slideshow, mais je trouve plus fonctionnel de le relier directement à un fichier XML dans lequel je vais charger mes images. C'est là que se pose mon problème, les images qui sont chargés se retrouvent les unes en dessous des autres alors que je souhaiterai qu'elles soient les unes à coté des autres (j'essaie d'être clair mais c'est pas évident ^^).
Merci à tous.

Voici ce que j'ai pour l'instant:

Citation : Pas de titre

<style type="text/css">

#slideshow-scroller {
width: 250px;
height: 200px;
overflow: hidden;
margin: 0 auto;
border: 5px solid #000;
}

#slideshow-previous, #slideshow-next {
width: 50px;
height: 30px;
position: absolute;
background-color: #AAAAAA;
top: 190px;
display: none;
cursor: pointer;
}

#slideshow-next {
display: block;
background-color: #AAAAAA;
top: 190px;
right: 0;

}

.slideshow-content {
height: 200px;
width: 250px;
float: left;

}

img{
height: 200px;
width: 250px;
}

#test1{
}

</style>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">

var totalSlides = 4;
var currentSlide = 1;
var contentSlides = "";
var jXML = {
getCount: function(xml,nodes) {
var response = {};
for (var node in nodes) {
response[node] = $(nodes[node],xml).length;
}
return response;
},};

function showPreviousSlide()
{
currentSlide--;
updateContentHolder();
updateButtons();
}

function showNextSlide()
{
currentSlide++;
updateContentHolder();
updateButtons();
}

function updateContentHolder()
{
var scrollAmount = 0;
contentSlides.each(function(i){
if(currentSlide - 1 > i) {
scrollAmount += this.clientWidth;
}
});
$("#slideshow-scroller").animate({scrollLeft: scrollAmount}, 1000);
}

function updateButtons()
{
if(currentSlide < totalSlides) {
$("#slideshow-next").show();
} else {
$("#slideshow-next").hide();
}
if(currentSlide > 1) {
$("#slideshow-previous").show();
} else {
$("#slideshow-previous").hide();
}
}

$(document).ready(function(){
$("#slideshow-previous").click(showPreviousSlide);
$("#slideshow-next").click(showNextSlide);

var totalWidth = 0;
contentSlides = $(".slideshow-content");
contentSlides.each(function(i){
totalWidth += this.clientWidth;
totalSlides++;
});

$("#slideshow-holder").width(totalWidth);
$("#slideshow-scroller").attr({scrollLeft: 0});
updateButtons();

$.ajax({
type: "GET",
url: "images.xml",
dataType: "xml",
success: function(xml) {

$(xml).find('sites').each(function(){

var id = $(this).attr('id');
$('<div id="slideshow-holder"></div>').appendTo('#slideshow-scroller');

$(this).find('site').each(function(){

var imagelink = $(this).find('imagelink').text();

$('<div class="slideshow-content"></div>').html(imagelink).appendTo('#slideshow-holder');
});
});

var count = jXML.getCount(xml,{"Sites":"site","Titre":"title","Description":"desc"});
var nombre = count["Sites"];
totalSlides = nombre
//alert (totalSlides);

//prompt( count["Sites"] + ", " + count["Titre"] + ", " + count["Description"] );

}
});

});

</script>
</head>
<body>

<div id="slideshow-scroller">

</div>

<div id="slideshow-previous"></div>
<div id="slideshow-next"></div>
</body

</ul>

Problème de récuperation de données dans un fichier XML avec

Problème de récuperation de données dans un fichier XML avec

Supprimer

Modérer

Signaler le message aux modérateurs