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

  • 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?

    Jotform Thread 1397166 Screenshot
  • TREVON
    Replied on February 26, 2018 at 1: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.

  • OptronicsHD
    Replied on February 26, 2018 at 1: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...

  • Mike_G JotForm Support
    Replied on February 26, 2018 at 3: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.

  • OptronicsHD
    Replied on February 26, 2018 at 3:44 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 

    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...

    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?

  • Adrian
    Replied on February 26, 2018 at 5: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 Screenshot 10

    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 Screenshot 21

    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.