Clivus Nondog

Navigation

Skip navigation.

Search

Site navigation

Email conversation

FromClivus Nondog
ToMe
Subjectjavascript oddity in all recent Opera
Date21 October 2005 01:45
Hi,
Thanks for the brilliantly useful website!

I'm having a problem resizing table cell widths from an 'onload' on a 
page in an iframe.  Works flawlessly in Firefox, Konquerer, ie5.5, 
Netscape 8, etc.

The parent page has a table with 1 row 2 cells.  Each cell has an 
iframe:

<table summary="one cell for width" width="100%" cellspacing="5" 
border="0" cellpadding="5" align="center" id="iframe_table">
<tr>
<td   id="iframe_table_left">
<iframe src="people_left.htm" height="400" width="100%" 
scrolling="auto" align="center" marginheight="5" marginwidth="5" 
frameborder="0" name="iframe_left" id="iframe_left">
</iframe>
</td>		
<td  id="iframe_table_right">
<iframe src="people_right.htm" height="400" width="100%" 
scrolling="auto" align="center" marginheight="5" marginwidth="5" 
frameborder="0" name="iframe_right" id="iframe_right">
</iframe>	
</td>
</tr>
</table>

I have tried all the various ways of coding this as you can see from 
the commented out lines below.  In Opera javascript alerts indicate the 
attribute is changed but the table is not redrawn. (is there a redraw 
or resize function for elements?)
I tried removing the iframes completely and resizing with an 'onload' 
in the parent page - no joy.  Also tried resize instructions for both 
table cells.

The parent page is also contained by an iframe but that doesn't bother 
any other browsers

javascript:
  cellSize = parent.document.getElementById('iframe_table_left');
// alert(cellSize.getAttribute('style.width'));
// cellSize.setAttribute('style.width','33%');
// alert(cellSize.getAttribute('style.width'));
 
cellSize.width = 33  + '%';
cellSize.style.width = 33  + '%';
// cellSizeO =  parent.document.'iframe_table_left'; 
// cellSizeO.style.width = 33  + '%';
// parent.document.iframe_table_left.style.width = 33%;
// 
parent.document.getElementById('iframe_table_left').style.setProperty('w
idth','33%');

I've thought to use nested tables for the iframes so each iframe has 
it's own table then resize the tables but ...
or resize the iframes but I am using percentages!  Opera won't resize 
event to pixel dimensions.
I am at my wits end with this and cannot find a mention of it on the 
net!
The only solution I can think of is to load different versions of the 
parent page for each link but that rather defeats the object of using 
frames (Iknow you don't like frames but I don't want to rely on 
js/css).  Perhaps there is some ways to put iframes side by side 
without a table then resize the iframes.  I'll try that next but in the 
meantime if you have any clues please let me know.

See the actual pages at:
[URL]

Thanks a bundle
FromMe
ToClivus Nondog
SubjectRe: javascript oddity in all recent Opera
Date21 October 2005 19:10
Clivus,

> I have tried all the various ways of coding this as you can see from the
> commented out lines below.  In Opera javascript alerts indicate the
> attribute is changed but the table is not redrawn. (is there a redraw or
> resize function for elements?)

Yep. This is a known bug in Opera, and thankfully it is fairly simple to
fix. It is a reflow bug. Forcing a reflow fixes it. Reflows can be forced by
changing the class of the body element.

cellSize = parent.document.getElementById('iframe_table_left');
cellSize.style.width = '30%';
document.body.className += '';

Note, the body class trick works in most browsers, and is capable of solving
reflow issues in almost all of them, so it is a useful trick to remember.


Hope this does what you need.


Mark 'Tarquin' Wilton-Jones - author of http://www.howtocreate.co.uk/
FromClivus Nondog
ToMe
SubjectRe: javascript oddity in all recent Opera
Date22 October 2005 02:57
FANTASTIC!!!!!
Thankyou soooo much.  Searched high and low for this one.
Low marks to Opera for not making this findable :( 
Still my favourite browser (esp now adfree)

Respect

Clivus
This site was created by Mark "Tarquin" Wilton-Jones.
Don't click this link unless you want to be banned from our site.