Results 1 to 4 of 4

Thread: Dynamic Ajax Content help needed

  1. #1
    Join Date
    Jul 2006
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Dynamic Ajax Content help needed

    Script: Dynamic Ajax Content
    http://www.dynamicdrive.com/dynamici...jaxcontent.htm

    couple of questions about this script, prob simple stuff but this is the first time i've used any code like this.

    i have a div i'm pulling content into:
    <div class="scrollframe" id="contentarea"></div>

    i then link to it from the menu:
    <a href="javascript:ajaxpage('news.html', 'contentarea');" class="navlink">NEWS</a>

    my question is how do i get the content of news.html to load into content area when the page first loads, as you can see (www.thesuffrajets.com/index2.html) when the page first loads the main window is being left blank.

    secondly i have a problem with alignment when other pages are being pulled in, they don't always display from the top (if you click around on the above link you'll see what i mean), any ideas how to get round that problem?

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    I see you've solved your first problem onload which is what I would have suggested. The second problem looks to me to be that because your 'contentarea' can be scrolled at the given moment that different content is loaded into it and because that new content can be taller than the visible part of the container, that the scroll state of the container is being preserved whenever possible. Here is what you need to execute to reset it to the top:

    Code:
    document.getElementById('contentarea').scrollTop=0
    You can either include this in the links:

    Code:
    <a href="javascript:document.getElementById('contentarea').scrollTop=0;ajaxpage('news.html', 'contentarea');" class="navlink">NEWS</a>
    Or make up a function for it and invoke it each time (put this inside a script block or on an external script linked to the page):

    Code:
    function resetS(){
    document.getElementById('contentarea').scrollTop=0;
    }
    Then you can do:

    Code:
    <a href="javascript:resetS();ajaxpage('news.html', 'contentarea');" class="navlink">NEWS</a>
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Dec 2007
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi, this looks like exactly what i need, but when i try to implement the code there is no effect.

    see the problem in action here:

    http://www.monkeytribe.net/index2.php

    the suggested code snippet is only on the "discog" link in the footer.

    any ideas what i have done wrong?

    thanks!

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    It isn't working on your page. There may be other problems, but the main reason that:

    Code:
    document.getElementById('contentarea').scrollTop=0
    doesn't work on your page is that 'contentarea' isn't the id of the element with the scrollbar. That element's id is 'leftcontent'.

    Get things out of whack (scrolled to a point that you don't want) and then paste this into the address bar and hit enter:

    Code:
    javascript:void(document.getElementById('leftcontent').scrollTop=0)
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

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