- KSIndustrialGroupAsked on October 18, 2013 at 11:38 AM
I have created my own lightbox popup to display inline HTML when you click it. I used the following plugin for the lightbox:
I am trying to embed a Jotform within the lightbox code but it doesn't display the form. 3 important things I noticed:
1. When I use the "embed code" option within lightbox, it DOESN'T show the form.
2. When I use the "source code" option within lightbox it DOES show the form.
3. When I use the "embed code" option OUTSIDE lightbox somewhere else in the code, it DOES show the form.
It only doesn't work when I try to use the embed option within the lightbox which is what I want... What would be the reason for this?
- JotForm SupportguilledutraAnswered on October 18, 2013 at 12:41 PM
could you try by using the Iframe code version of your form:
Hope it helps
please let us know if you need further assistance
- KSIndustrialGroupAnswered on October 21, 2013 at 11:40 AM
Thanks for the info... iframe works great except for one issue I'm dealing with now. Things seem fine in Safari and Chrome, however when I test it in IE9 and Firefox, the frame only partially appears in the window on the first click. Then if you click out of the lightbox popup and and click it again, the full form appears. Obviously I would like it to fully appear on the first click
Use the link below to see what I am talking about, just click the "KARL STORZ Industrial Financing Now Available" banner just below the image slider.
- EliezerNAnswered on October 21, 2013 at 12:40 PM
I tested your form in FireFox and found that the height is automatically changed from 476px to 40px:
So, in order to fix the issue, Please edit the height of the iFrame by adding !important after 476px as I've highlighted below:
<iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="//support.jotform.com/form/32904995633161" frameborder="0" style="width:100%; height:476px !important; border:none;" scrolling="no"></iframe>
That will enforce the to the browser to apply the height 476px.
I hope that helps, however, don't hesitate to contact us if you need further assistance with this.