I am missing some probably trivial understanding regarding when jquery code can be called, and would like some pointers please.
the particular example happens to be for a slideshow, but could be any other jquery functionality.
So I have this situation where the normal call is on ready like this
<script type="text/javascript">
function onBefore() {
$('#output').html("Scrolling image:<br>" + this.src);
}
function onAfter() {
$('#output').html("Scroll complete for:<br>" + this.src)
.append('<h3>' + this.alt + '</h3>');
}
$(document).ready(function() {
$('.slideshow').cycle({
fx: 'scrollLeft',
timeout: 5000,
before : onBefore,
after : onAfter
});
});
</script>
I have included the 2 callback functions there but they are not relevant to my question particularly
Ok that works perfectly and all occurs as it should
What I actually want is the on ready function to call a getContent() function that loads content to the page and then calls the jquery
all works in terms of the content load, but the jquery call produces an error so I am obviously calling it incorrectly
my ready function just does this and works correctly
<script type="text/javascript">
$(document).ready(function(){
http = getHTTPObject();
http2 = getHTTPObject();
loadContent();
});
</script>
the loadContent calls my serverside code by ajax correctly ( no particular reason not to use jquery ajax), but after the call I wish to initiate the slideshow so it looks like this
function initSS()
{
alert('starting');
alert('here');
alert($('.slideshow').length);
$('.slideshow').cycle({
fx: 'scrollLeft',
timeout: 5000,
before : onBefore,
after : onAfter
});
alert('done');
}
function showContent()
{
if(http.readyState == 4)
{
alert(http.responseText);
eval(http.responseText);
initSS();
}
}
function loadContent()
{
var url='loadindexcontent.php';
//alert(url);
http.open("GET",url, true);
http.onreadystatechange=showContent;
http.send(null);
}
the content loads perfectly, just the jquery fails
any help would be greatly appreciated
John