Witam,
Korzystam z galerii AD Gallery pod którą chciałbym podpiąć XML'a zamiast wpisywać wszystko w pliku HTML. Niestety bez powodzenia, nie chce wyświetlić zawartości tego pliku.
Poniżej poszczególne kody:
HTML: <div class="ad-image-wrapper"> <div class="ad-controls"> <ul class="ad-thumb-list"> <img src="images/thumbs/t1.jpg" title="Title for 1.jpg"> <img src="images/thumbs/t2.jpg" longdesc="http://www.example.com" alt="Description of the image 2.jpg">
XML:<?xml version="1.0" encoding="utf-8" ?>
<Miejsca>
<photo>
<thumbnail>galerie/miejsca/thumbs/s_Aureus.jpg</thumbnail>
<image>galerie/miejsca/Aureus.jpg</image>
<title>Pałac Aureus</title>
<description>
Pię(tm)kny, wiekowy budynek wraz z otaczają…cym go ogrodem, położony w centrum Słupska.
</description>
</photo>
<photo>
<thumbnail>galerie/miejsca/thumbs/s_Palac_w_Godetowie.jpg</thumbnail>
<image>galerie/miejsca/Palac_w_Godetowie.jpg</image>
<title>Pałac Godę(tm)towo</title>
<description>
Historia pałacu w Godętowie sią(tm)ga XII wieku. Obiekt zachował styl starego mają…tku z urokliwym stawem, starodrzewem oraz z zachowaniem ducha minionych epok.
</description>
</photo>
<photo>
<thumbnail>galerie/miejsca/thumbs/s_Royal_Baltic.jpg</thumbnail>
<image>galerie/miejsca/Royal_Baltic.jpg</image>
<title>Royal Baltic</title>
<description>
Hotel Royal Baltic położony wś›ród sosnowego lasu, oddalony 150 m od usteckich plaż i szumu morza.
</description>
</photo>
<photo>
<thumbnail>galerie/miejsca/thumbs/s_Columbus.jpg</thumbnail>
<image>galerie/miejsca/Columbus.jpg</image>
<title>Columbus</title>
<description>
Obiekt położony jest w zacisznej i kameralnej czą(tm)ś›ci Rowów, blisko plaży, około 70 metrów do morza.
</description>
</photo>
</Miejsca>
I moje dotychczasowe wypociny:Kod
<script>
$(document).ready(function () {
$.ajax({
type: "GET",
url: "miejsca.xml",
dataType: "xml",
success: xmlParser
});
});
function xmlParser(xml) {
$(xml).find("photo").each(function () {
$(".ad-thumb-list").append('<li><a href="' + $(this).find("image").text() + '"><img src="' + $(this).find("thumbnail").text() + '" title="' + $(this).find("title").text() + '" alt="' + $(this).find("description").text() + '"></a></li>');
$(".ad-thumb-list").fadeIn(1000);
$(".ad-thumbs").mouseover(function(){
$(this).css('border-color','#A4045A');
});
$(".ad-thumbs").mouseout(function(){
$(this).css('border-color','#aaa');
});
});
}
</script>
Zapomniałem o jednej rzeczy, pewnie istotnej dla poprawnego wyświetlania miniaturek.
W przykładowym pliku html listowanie zawiera dla każdej pozycji klasę class="image0", class="image1", itd.
<img src="images/thumbs/t1.jpg" class="image0"> <img src="images/thumbs/t10.jpg" title="A title for 10.jpg" alt="This is a nice, and incredibly descriptive, description of the image 10.jpg" class="image1">
Ten post edytował Przemo75 24.11.2010, 13:31:19