javascript - Setting a minimum height of a container on page load prototype -


ok, trying set minimum height of container dynamically on page load using prototype page displays correctly. header , footer equal 345px in height, trying set main-container div's minimum height window's inner height minus these dimensions when page loads, pages no content in these fivs appear correctly. here have tried far:

document.observe("dom:loaded", function() {     var minheight = window.innerheight;     minheight -= 345;     $('main-container').style.minheight = minheight; }); 

and:

document.observe("dom:loaded", function() {     var minheight = window.innerheight;     minheight -= 345;     $('main-container').setstyle({         minheight : minheight     }); }); 

i know script fires on page load via alert in document.observe function, isn't adding height or throwing errors. ideas?

edit

thanks @andrew answering, have added code when user resizes , thought i'd share:

event.observe(window, 'resize', function() {     var minheight = window.innerheight;     minheight -= 345;     $('main-container').setstyle({         'min-height' : minheight+'px'     }); }); 

shouldnt minheight : minheight 'min-height' : minheight+'px'


Comments

Popular posts from this blog

Why does Ruby on Rails generate add a blank line to the end of a file? -

keyboard - Smiles and long press feature in Android -

node.js - Bad Request - node js ajax post -