www.webdeveloper.com
Results 1 to 3 of 3

Thread: [RESOLVED] Changing TD height

  1. #1
    Join Date
    May 2009
    Location
    Hampshire, UK
    Posts
    277

    resolved [RESOLVED] Changing TD height

    I am pretty sure it cannot be done as I can see no errors in my code, however I would like to hear someone else's opinion as I may be missing something. I am using a table to help align elements around a page, I would usually be using divs etc but as it is a complicated setup I have chosen to use a table. Anyway on the right hand side of the page I have a column which contains a photo, this td has its position fixed on the screen so when the user scrolls down the page only the gallery td scrolls and the rest remains where it is. However when testing on a smaller screen yesterday I realised that if my td is larger than the monitor or screen then the user cannot scroll down the fixed element. I have therefore come up with the solution of applying 'overflow: auto' to the fixed element. This will only work though if the height of the element is set to the height of the inner page. This is where my script comes in, I need to load the page then change the height of the TD dynamically so that the td can be scrolled down. Understand? Apologies for the long explanation.

    This is my javascript:
    HTML Code:
    <script type="text/javascript" language="javascript">
    		function photoHeight() {
    			document.getElementById('photo').style.height=window.innerHeight - 59+'px';
    		}
    	</script>
    Then obviously I have placed 'photoHeight()' into the body onload element.

    I cannot understand why this is working, please help.

    Thanks in Advance,

    Ben

  2. #2
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Missing brackets in the calculation and not accounting for browser differences:
    Code:
    function photoHeight() {
    var h = 0;
    if (window.innerHeight)
        h=window.innerHeight;
    else if (document.documentElement && document.documentElement.clientHeight)
        h=document.documentElement.clientHeight;
    else if (document.body)
        h=document.body.clientHeight;
    document.getElementById('photo').style.height=(h - 59)+'px';
    }

  3. #3
    Join Date
    May 2009
    Location
    Hampshire, UK
    Posts
    277
    Thank you, I resolved the issue myself. I assumed I didn't need brackets to start.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles