简体   繁体   中英

Javascript for putting new content in a div upon click - automatically scrolling down to new content isn't working

Here's the code that I'm using. I want the user to be able to click on the flowers, and to have them automatically be scrolled down to the div where the larger flowers pops up. Sometimes it does this, sometimes it goes down for a split second and goes back up. What's wrong? Here's the site in action, but you have to wait a bit for the images to load:

http://www.momentaryvitality.ca/prairie2.shtml

function updateContainer(url) {
    dynamicCon = '#dynamicContainer';
    ObjTag = $(dynamicCon);
    ObjTag.load(url);
}
$(document).ready(function () {
    $('a[rel="dynamicLoad"]').bind("click", function (event) {
        url = $(this).attr('href');
        updateContainer(url);
        event.preventDefault();
        event.stopPropagation();
    });
});

If you open up the javascript console, you will see:

Uncaught ReferenceError: height is not defined

Which points to this line of code:

    ({
        scrollTop: height
    }, 3000);

Which does nothing, and it uses an undefined variable to do that nothing. And sadly, your intent is somewhat unclear, but I'd start with fixing those 2 problems.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM