html - Get Iframe to fill to bottom of page -
html - Get Iframe to fill to bottom of page -
this seems should simple question cannot seem find solution anywhere.
on website making have navigation bar @ top of page 43px in height , in effort not have edit each individual page create did set iframe below @ 100% width navigation buttons targeting source of iframe.
now run issue want iframe extend bottom of navigation bar bottom of page cannot tell iframed in if set height 100% set height of entire page , adds 2nd scrollbar compensate 43px @ bottom, how can fit iframe remaining space below nav bar ?
i have tried setting different % not work different res monitors. , need work cross browser (in ie, chrome, safari, , mozilla, preferably in opera that's not necessity).
sorry little wordy, can help?
pretty simple. need subtract height of navigation current viewport height , set iframe's height. utilize javascript method:
function resizeiframe() { var nnavigationheight = 43; // assuming 43px stated above var nviewheight = document.body.clientheight; var niframeheight = nviewheight - nnavigationheight; document.getelementbyid("youriframeid").style.height = niframeheight + "px"; }
you'll need set body , html 100% height work.
body, html { height: 100%; }
i should mention dubious way of achieving want do, it's solution true letter of question. i'd recommend using jquery rather vanilla javascript cross-browser headaches minimised (i've tested code in current installations of ie 7 & 8, ff, chrome, , safari without issue, mileage may vary). if decide go route, improve take advantage of first-class , simple ajax functionality using div , dispense iframe entirely.
html css iframe
Comments
Post a Comment