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-gallery"> <div class="ad-image-wrapper"> </div> <div class="ad-controls"> </div> <div class="ad-nav"> <div class="ad-thumbs"> <ul class="ad-thumb-list"> <li> <a href="images/1.jpg"> <img src="images/thumbs/t1.jpg" title="Title for 1.jpg"> </a> </li> <li> <a href="images/2.jpg"> <img src="images/thumbs/t2.jpg" longdesc="http://www.example.com" alt="Description of the image 2.jpg"> </a> </li> </ul> </div> </div> </div>
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>
$(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.