开发者

.load jquery function not working when using specific div

开发者 https://www.devze.com 2023-02-16 01:42 出处:网络
This line does not work $(\'#bookcontainer\').load( startSlide ); while this line does $(window).load( startSlide );

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,
        eas开发者_StackOverflow中文版ing: '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();
};


The load event can only be handled on elements that are associated with a url. From the documentation:

The load event is sent to an element when it and all sub-elements have been completely loaded. This event can be sent to any element associated with a URL: images, scripts, frames, iframes, and the window object.

If you're waiting on all of your images to load, you could apply the event handler to those images individually.

Also: $(window).load(...) will not be fired until all elements on the page are fully loaded (including graphics), so it's not necessary to bind the event to a div to make sure child elements have loaded.

If you're making an AJAX request and attempting to detect when content has been loaded into that div, you should make startSlide the success callback to your AJAX request.


You should use $('#bookcontainer').load('url', startSlide ); have a look at http://api.jquery.com/load/


The div element does not trigger a load event.

0

精彩评论

暂无评论...
验证码 换一张
取 消