Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Mar 2012
    Posts
    17
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Cool Hide a loading div if not new content available to load

    Hello,

    I have been everywhere still trying to find a solution of this,

    I have the following code which loads a new html page into the bottom of my document when the user reaches the bottom of the page.

    Code:
    alreadyloading = false;
    nextpage = 2;
     
    $(window).scroll(function() {
        if($(window).scrollTop() + $(window).height() == $(document).height()) {
            if (alreadyloading == false) {
    			$("#loading").slideDown();
                var url = "page"+nextpage+".html";
                alreadyloading = true;
                $.post(url, function(data) {
                    $('#newcontent').children().last().after(data);
                    alreadyloading = false;
                    nextpage++;
    				$("#loading").slideUp();
                });
            }
        }
    });
    #Loading is a div which contains a loading jpeg which is fixed to the bottom of the screen. This div appears when the user hits the bottom of the screen, and then disappears once the content has fully loaded.

    The problem I have is that once the user has loaded all the content that is available. Say I have 'page2.html, page3.html, page4.html' to load one at a time as the user hits the bottom of the screen. I need the loading bar to stay hidden when it tries to load the 'page5' which does not yet exist...

    Is this easy to do to alter my javascript code?

    I am at a loss with this. Any help would be appreciated. I asked a similar question before but have adapted the code now for the loading bar, just need this little glitch to be fixed.

    Thank you!

    Website at:

    www.jb-design.me/marchupdate2/

    so you can see that I mean. (note that the graphics on the website are made by me but are not my work, just for placement)
    Last edited by jbyrne; 03-18-2012 at 04:59 PM. Reason: Website added...

  • #2
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,581
    Thanks
    23
    Thanked 644 Times in 643 Posts
    $('element').length == 0; means no element found
    if ($('element').length) { means the element was found

    Use either line to show/not show your loading image

  • #3
    New Coder
    Join Date
    Mar 2012
    Posts
    17
    Thanks
    2
    Thanked 0 Times in 0 Posts
    $('element').length == 0;

    ^^ isn't this to say whether it is currently available on the page?
    I could be wrong. Can it be used to search the index folder of the website, to try to find the next 'page#.html' '# meaning number'

    Just like "var url = "page"+nextpage+".html";" does?

    Thanks for the reply though!

  • #4
    New Coder
    Join Date
    Mar 2012
    Posts
    17
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Solved by using ajax instead. was able to use the error and complete function to do what i wanted! Thanks for your help


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •