This line does not work
$('#bookcontainer').load( startSlide );
while this line does
$(window).load( startSlide );
#bookcontainer is a div containing four images.
Here's my whole code:
// JavaScript Document
$('#bookcontainer').load( startSlide );
var slide;
$('#slider').hover(
function() {
$('.arrow').show();
},
function() {
$('.arrow').hide();
});
function startSlide() {
$('.book').show();
slide = setInterval(slideR, 5000);
}
function slideR() {
$('.book').first().css('left', '960px').appendTo('#bookcontainer').animate(
{
"left": "-=960px"
}, {
duration: 1000,
easing: 'easeOutCubic'
});
}
function slideL() {
$('.book').last().animate(
{ "left":"+=960px" }, {
duration: 1000,
easing: 'easeOutCubic',
complete: function() {
$(this).prependTo('#bookcontainer').css('left', '0px');
}
});
}
function right() {
clearInterval(slide);
slideR();
startSlide();
};
function left() {
clearInterval(slide);
slideL();
startSlide();
};
