Question

I have appended an iFrame to a div. I am changing the height of the div on iframe’s load event (using jQuery).

The problem is that in the iframe there are a lots of text fields, and when the user enters large amounts of text, they become multi-line (at the beginning they are one line text fields). So, because new lines are added, the iframe height expands, but the load event of iframe does not catch this.

What is the best way (thinking about performance) to change the div height when – because of some event – the iframe height is changed?

I have considered binding onchange function of each textfield but I do not like this, because sometimes I will have functions already bound to those fields?

Answer 1

Try:

$("#frame_id").height($("#frame_id").contents().find("html").height());