Dynamically resizing an iframe issue
in [JavaScript]
|
Prev: Firefox Object bug
Next: innerHTML (was: IE9.js)
From: Jukka K. Korpela on 5 Apr 2010 10:17 DL wrote: > Now, I'd to try a different approach, that is, using 87.5% > of screen width and height for an iframe with an HTML page. Sorry, that does not make sense. If I'm viewing your page, say, on my 1680px wide screen using a 400px wide browser window, what would happen if you managed to set your iframe width to 87.5% of screen width? It would make sense to set the width as a percentage of available width, but you don't need JavaScript for that: just set the width as a percentage in HTML or in CSS. -- Yucca, http://www.cs.tut.fi/~jkorpela/
From: DL on 5 Apr 2010 12:44 On Apr 5, 10:17 am, "Jukka K. Korpela" <jkorp...(a)cs.tut.fi> wrote: > DL wrote: > > Now, I'd to try a different approach, that is, using 87.5% > > of screen width and height for an iframe with an HTML page. > > Sorry, that does not make sense. > > If I'm viewing your page, say, on my 1680px wide screen using a 400px wide > browser window, what would happen if you managed to set your iframe width to > 87.5% of screen width? > > It would make sense to set the width as a percentage of available width, but > you don't need JavaScript for that: just set the width as a percentage in > HTML or in CSS. > > -- > Yucca,http://www.cs.tut.fi/~jkorpela/ Jukka, The page has other elements, for instance, it sort of looks like this: top layer: text formatting button 1, button 2, button 3... middle layer: the iframe: text input area, its width/height is the Very Subject we're dealing here bottom layer: functional buttons such as Save, Cancel etc. Am I any good in describing it better? Thanks. Don
From: SAM on 5 Apr 2010 15:26 Le 4/5/10 6:03 AM, DL a �crit : > Hi, > > The following code works fine: > var fs = document.getElementById('txt').style; > fs.height = (+fs.height.replace('px','') + 100) + 'px'; > // it works. > > /* suppose, the extra 100 pix is enough > but problem is, what is the user's monitor is much bigger or smaller > hence, a dynamic value such as percentage would suit the situation > better, to this end, I attempted the following > */ > > fs.height = (+fs.height.replace('px','') + 40%); % in JS means modulo ... ! maybe : fs.height = (fs.height.replace('px','') * 1.4) + 'px'; fs.height = parseInt(fs.height) * 1.4 + 'px'; no ? > // say, we want to increase height by 40% > // it does not work. How to fix it? > > The above script references the following HTML code why isn't there a css rule ? > <form> And the form is supposed to submit the iframe ? > <iframe id="txt" name="txt"/> > </form> > > Many thanks.
From: SAM on 5 Apr 2010 15:51 Le 4/5/10 4:14 PM, DL a �crit : > > Now, I'd to try a different approach, that is, using 87.5% > of screen width and height for an iframe with an HTML page. not of "screen" but navigator's window area to display web pages (the viewport ?) In the head : <style type="text/css"> html, body { height: 100%; margin: 0;} iframe { height: 82.5%; width: 73.5%; border: 2px solid } </style> not tested in IE -- sm
From: SAM on 5 Apr 2010 16:01
Le 4/5/10 6:44 PM, DL a �crit : > On Apr 5, 10:17 am, "Jukka K. Korpela" <jkorp...(a)cs.tut.fi> wrote: >> >> It would make sense to set the width as a percentage of available width, but >> you don't need JavaScript for that: just set the width as a percentage in >> HTML or in CSS. > > Jukka, > > The page has other elements, for instance, it sort of looks like this: and then ? You can't set css rules for them ? div { position relative; margin: 0; } #top_layer { height: 11% } #middle_layer { height: 80%; padding: 0 } #bottom_layer { height: 9% } #middle_layer iframe { height: 100%; width: 100% } #top_layer .button { height: 90%; margin: 4%; } > top layer: > text formatting button 1, button 2, button 3... > > middle layer: > the iframe: text input area, its width/height is the Very Subject > we're dealing here > > bottom layer: > functional buttons such as Save, Cancel etc. > > Am I any good in describing it better? in what you want to get -- sm |