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:
Then obviously I have placed 'photoHeight()' into the body onload element.HTML Code:<script type="text/javascript" language="javascript"> function photoHeight() { document.getElementById('photo').style.height=window.innerHeight - 59+'px'; } </script>
I cannot understand why this is working, please help.
Thanks in Advance,
Ben


Reply With Quote
Bookmarks