json and jquery image gallery
hi
with the help of various searches, i managed to use an image liding gallery plugin,whereby when clicking the left/right arrow images slide in and out
it works fine, though now that i wanted to update my images, i notied that i needed to go into my html and modify it (which was harder than it could be)
so (even just for practice) i tried used json to inject all the images, this is the code:
$.getJSON('data.txt', function(data) {
var len = data.length, i; for (i = 0; i < len; i += 1) {
$
("#image_container").append(
'<div class="image_frame"><img class="image" src="' + data[i].image + '" width="620px" alt="' + data[i].alt + '">
<div class="caption"></div><div class="innercaption"><p><span>'
+ data[i].category +
'</span> |' + data[i].title + '</p></div><div class="caption2"></div><div class="innercaption2">
<p><span>Description</span> | '
+ data[i].description + '</p></div></div>' );
};
});
it does what it suposed to do but now the sliding does not work, i think this is because the sliding effect and the json code are runnig on dom.ready, which might mean the slider does not know the above code is in the page
is there a way of making this work.
also this is the page when all the code was in the html file http://aurelkurtula.co.uk/portfolio/index1.php
and now this is the page when i am trying to use the json - http://aurelkurtula.co.uk/portfolio/ - as you can see the getJSON takes action but the slider does not
also if you need to inspect the code -- the
getJSON is located at scripts/gallery.js and the gallery animation is at scripts/anchor.js
i really hope you will be able to help
thanks a lot