iframe has two attributes of the height parameter
Status: Beta
Brought to you by:
worden
Menu
▾
▴
1 Attachments
#588 iframe has two attributes of the height parameter
And that can be confusing, for example, I get an iframe for my d3.js with the height 8px (see the attachment). It works fine in Firefox, but in Chrome sometimes not.
The link is http://yushan.mcmaster.ca/theobio/akhmetzhanov/index.php/HIV_prevalence_in_Africa (but the page might be changed soon)
Discussion
Anonymous
(Andrei)
That's odd, the code is written to create the iframe at height 1000 (here, at line 2216) and then resize it to fit the content once it loads (here, line 22).
I'm not sure where that
style=is coming from. I'll try to track it down. What problems does it cause? Does it fail to resize properly after loading the map?This looks relevant: http://stackoverflow.com/questions/3085530/chrome-iframe-display-white-box
It might be that the empty
<body>tag that fills the iframe before its content loads comes withmargin: 8px. Seems like that wouldn't cause a literal style attribute to appear though.I notice the iframe code is sort of old and it'd be nice to reorganize it using the jQuery and ResourceLoader features that are available in post-1.19 MediaWiki. Maybe I'll just do that and see if the problem goes away :)
Lee, the problem is that if I create the button "Play" before creating the canvas svg, then the height in the iframe will be inherited from the button (which I assume, exactly 8px).
In Chrome I can use Inspector and switch between your height 1000 and style:height=8px, but the browser chooses the latter by default
ah no, I am wrong - I created a page just with the button and svg and I have got the height of svg, as it was expected
http://lalashan.mcmaster.ca/theobio/akhmetzhanov/index.php/Test_2
ps: however, I am confused by 524px in my previous example :/
OK! My javascript code is assuming that once the HTML is loaded into
the iframe, its height won't change any more. So you may be seeing
different heights at different times because it's random whether it does
the height adjustment before or after your code creates the canvas.
There must be a way to fix this - it's not obvious, because your code is
prohibited from touching things in the outer document, so you can't have
it update the iframe's size. I guess my code can watch the iframe
contents and keep the height updated. I wouldn't want to spend wasteful
computation checking on iframes excessively - maybe there's a better way.
Or would it work for you to write your html so that its body is
initialized with the full height, and stays the same size?
Well, this link makes it look easy to track size changes in the iframe's content. So I should try that - if it works as advertised you won't need to change anything.
Lee, thanks - I would like to keep the possibility to update the height. Ex: if I want to have it connected with the window size of my browser
On 08/18/2014 02:31 PM, Andrei Akhmetzhanov wrote:
OK, I think I can do that.
I don't think you can get window size changes from within an iframe
though. The iframe is designed to wall off the page within from the
stuff outside, for security.
However, you could do it by writing some separate javascript that runs
in the outer page. I'd be happy to talk to you about that. Once you do
that, you can resize the iframe yourself if you want.
Reorganized and made the problem go away. It should now automatically resize the iframe if the document within resizes. Let me know if you have any further trouble with it.
Super! Thanks a lot! (I will write if I notice smth)
Lee, sometimes when I load the page, I get the height of an iframe 100px. It can be changed to normal by Ctrl-F5
Do you have an idea why?
Thank you in advance
Maybe you're getting a cached page, with the old javascript and css.
Let me know if the problem persists longer-term, or happens after you
edit the page, please.
OK, I'll do you one better - I just loaded the page and got no iframe!
Yes, I have checked that. It happens only when I load the page at the first time. Then I use Ctrl-F5 and it gets Ok.
Lee, if you are logged-in to that page, do you see it normally?
ps: I meant it is not connected with a long cache thing.
ps2: and I saw it only in Firefox (it works normally in Chrome)
the problem does not disturb me a lot - maybe, we can keep it for later
If the page is loaded slowly, then the height can be even 0px, see the attachment: in Chrome it might go further and update the page to its supposed height after, but in FF it does not happen by some reason and I need to refresh the page by myself