Why is embedded card layout form not load in fullscreen automatically?

  • Profile Image
    OptronicsHD
    Asked on February 26, 2018 at 12:01 PM

    I'd like my form to go full screen when anyone accesses it either from the Jotform URL, or from where have it embedded on a page we'd like it to go like this one:

    https://www.optronics.com/microcast-producer-medical-video-editing.html 

    It is not going full screen automatically like I have checked (see screenshot) and is giving many of the "cards" a scrollbar when the content is a bit taller. Or is there a way to just have the content of each card adjust correctly to the height of the content?

  • Profile Image
    TREVON
    Answered on February 26, 2018 at 01:44 PM

    1. I'd like my form to go full screen when anyone accesses it either from the Jotform URL, or from where have it embedded on a page we'd like it to go like this one:

    https://www.optronics.com/microcast-producer-medical-video-editing.html 

    It is not going full screen automatically like I have checked (see screenshot) 

    There needs to be a trigger for the form to adjust to fullscreen hence the reason you have the screen adjusting when you click on start button. This however happens on embedded form. When form is accessed directly it is loaded in fullscreen by default.

    I may have a suggestion you could try. Would you kindly disable the start page then test the embedded form?

    2. and is giving many of the "cards" a scrollbar when the content is a bit taller. Or is there a way to just have the content of each card adjust correctly to the height of the content?

    Unfortunately at the moment this is not possible this is because you may have a form with a list of 20 items and another card with 5 items and best way to retain the design of each card is by enabling scroll option.

  • Profile Image
    OptronicsHD
    Answered on February 26, 2018 at 01:52 PM

    Hi @TREVON I disabled the "start page" now it's just showing the title of my form at the top, which I'd like to remove. Since the "card height" isn't something to control at the moment, I'd definitely like to try the suggestion you had to make the full screen work, what is it?

    Thanks...

  • Profile Image
    Mike_G
    Answered on February 26, 2018 at 03:31 PM

    The FullScreen option only works when the form is embedded.

    Please try accessing this link where I have embedded a clone version of your form. Once the page loads, click the Start button and the form will go fullscreen automatically.

    The Start button acts like a trigger as explained by my colleague above. Please give it a try and let us know if you have other questions or concerns.

  • Profile Image
    Adrian
    Answered on February 26, 2018 at 05:40 PM

    It's still not going full screen. It doesn't seem like anything changed. Watch me screen capture... https://karlstorz.box.com/s/k4qkylcvwhxnavhg1i36lnf1r8a81qt4 

    I have tried this in Safari and it works when the page is loaded the first time. It does not work when the page is reloaded.

    1519683814giff.gif

    Is there any way to control the embed size? Like make it 100% width 100% height? Or give the form a certain height? I think you basically know what I'm trying to achieve with this form right? Have it be as automatically LARGE as possible no matter where it is...

    You can achieve that if you use the Iframe embed method and customize it a little.
    Here is an example: https://goo.gl/E9j5LF
    Using this method, the fullscreen option works every time.

    You can copy the source code for that from here: https://pastebin.com/raw/SMSHjPx9
    Adjust the height as needed.

    1519684757awd.png

    Also I noticed one more issue, you can skip required questions by clicking the dots on the timeline at the bottom. Can this be stopped?

    Yes, you can skip the questions by clicking on the dots at the bottom but the form cannot be submitted if the user doesn't fill all the required fields.