Results 1 to 6 of 6

Thread: ajax div resize issue?

  1. #1
    Join Date
    Jun 2008
    Posts
    3
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default ajax div resize issue?

    Hi ,

    I am a coding novice and have a 5 page site loading external pages with ajax into a div called dMiddle. When the page loads the css is not working and my footer is overlapping the content of dMiddle. Once I click a link it resizes to the correct size. I have my pageholder set to auto height and values for other divs but I assume it's the javascipt function causing the problem. Here is the code:

    function fnReset(){ //this fnReset() call is found in the simpleAjax.js
    document.getElementById('dTorso').style.height="auto";
    document.getElementById('dLeft').style.height="auto";
    document.getElementById('dMiddle').style.height="auto";
    document.getElementById('dRight').style.height="auto";
    var disMaxHt=Math.max(parseInt(document.getElementById('dTorso').scrollHeight),parseInt(document.getElem entById('dLeft').scrollHeight),parseInt(document.getElementById('dMiddle').scrollHeight),parseInt(do cument.getElementById('dRight').scrollHeight));
    document.getElementById('dTorso').style.height=disMaxHt + "px";
    document.getElementById('dLeft').style.height="100%";
    document.getElementById('dMiddle').style.height="100%";
    document.getElementById('dRight').style.height="100%";
    }

    any suggestions would be greatly appreciated!

  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

    A better solution would be to redesign the page so that its layout is not dependant upon javascript. However, if in fact this routine from your post makes things right when run from the AJAX script, you could add it to your onload events and it might then take care of things onload as well.

    If you have no other onload event(s), you could just add one to your existing body tag, ex:

    Code:
    <body onload="fnReset();">
    Now, without seeing the page I can't be sure of everything you have going on there, so there could be other issues.
    - John
    ________________________

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

  3. The Following User Says Thank You to jscheuer1 For This Useful Post:

    enzedbro (06-17-2008)

  4. #3
    Join Date
    Jun 2008
    Posts
    3
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    ...there must be other issues. I had a js file linked via a url ref and now I have it in the root folder but still no joy. I tried the onload idea but it seems to have no effect. Thanks for the advice. I'll keep investigating....

  5. #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

    Please post a link to the page on your site that contains the problematic code so we can check it out.
    - John
    ________________________

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

  6. The Following User Says Thank You to jscheuer1 For This Useful Post:

    enzedbro (06-18-2008)

  7. #5
    Join Date
    Jun 2008
    Posts
    3
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    http://www.7018qca.com/innes%5Falast...ile/index.html

    here's the link, it's a fictional site for an assignment. Because of my limited knowledge of js the problem could be anywhere....

  8. #6
    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 thought you were saying that the page didn't load correctly at first, but that it then was fine once content was imported. I'm seeing the opposite problem. Removing all height dimension from dTorso (not setting any to begin with or at any point in the process of adding content) seems like a viable approach.

    A division with a set width will automatically get taller or shorter to match the requirements of its content, even when that content changes - as long as there are no constraints on its height from a parent element or its own styles or attributes.

    In any case, in IE 7, when I hit 'news' dTorso was cut off by dSubFooter at the bottom. In IE developer extension, I simply removed the dTorso's style height completely and everything looked fine after that. So, as I say, just don't set height for dTorso, ever.
    - 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
  •