How to set iframe size dynamically?

How to set iframe size dynamically?

Hello,

I am working on displaying the following ZohoCreator form on http://sharespace.co (please scroll down to the section "Pricing, Quotes and Inquiries" to see the form).

What I would like is to have the form's height change dynamically, as the content within the frame's height changes. The form currently works that only 5 questions display, and as you fill out the form, it expands to revel more questions. With the current styling, I can only set the iframe height to a specific value (I've chosen 550px) and allow scrolling so the rest of the form displays when it is reveled.

How can I go about having the form dynamically grow in height, depending on what content is showing in the frame?

I attempted to use the following script with no luck: 

  1. <iframe src="http://fullformlocationURL" width="100%" class="myIframe"></iframe> <script type="text/javascript" language="javascript"> $('.myIframe').css('height', $(window).height()+'px'); </script>
I appreciate your help!

Tara (on behalf of Teya Sparks)