Loser's Guide Loser's Guide

 Loser's Guide to Life

Saturday, August 05, 2006

Javascript Time II 

This may be illegal or something but it seems to work, in case you ever have the following problem:

You have a page which displays in the iframe of another page, the so-called “parent”. This “child” page in turn has a toggle feature: you click on it to view a portion containing pictures of whatever which is normally hidden to preserve your tasteful layout. But the toggled part is going to make the child page taller while the iframe remains the same size as before, so some of the new part will be hidden. Moreover, you still want the new part to close any previousy-toggled portion of the child page. What to do?

Once again the answer is childishly simple and should only take a few weeks of messing around to discover.

First do the toggle thing; then adjust the height of the iframe; then close the other thing. The first and last are straightforward, because you merely add


right after the toggle command, whatever it is. For example:

<a href="javascript:toggle('hiddenpart')" onblur="closeAll()">Hidden Part</a>

(“Hidden Part” is the name of the hidden part, identified by an “id” as hiddenpart. “CloseAll” refers to a few lines of script which has to be added in the head and was discussed last time.) But this time you want to start a javascript which is in the parent page and serves to adjust its iframe to fit any new page that comes in. It has already done that for this child, and there's not a new page, just a new part of that page. How to get it back on the job?

What you do is insert an “if” clause in the command:

if (parent.calcHeight) parent.calcHeight();

This “calcHeight()” is the function in the parent page that adjusts the iframe. But how do you sneak this clause in? I found that to be the tricky part, because it has to be tacked on to the toggle command as a sort of “Oh, and while you're up” gambit, and won't work with anything else. The complete command looks like this:
<a href="javascript:toggle('hiddenpart');if (parent.calcHeight) parent.calcHeight();" onblur="closeAll()">Hidden Part</a>
So there you have it. Three in one blow.


Post a Comment

Watching TV is a good way to tear yourself away from the computer.