JotForm doesn't seem to generate scroll bars within Articulate Storyline 3

Hi,

I use JotForm to record when people have completed an online training courses in Articulate Storyline 3. When I embed a webpage withing the program scroll bars are automatically generated. However when I embed JotForm it doesn't seem to want to do this and therefore the fields are hidden and learners can't scroll down the page to fill them in.

I'm producing the e-learning in HTML5 rather than Flash so the courses run on tablets and smartphones. I've set the form to be 'responsive' (I'll try and see what happens if I make it unresponsive) but meanwhile if you can give me any ideas that would be good.

Many thanks,

Tony

Hi Tony, 

May I ask what method you're using to embed your form? We always recommend using the iFrame method, as it will make sure that any script conflict is overcome, and your form display in the hosting page is the same as the standalone version. 

Please follow the guide below to find the iFrame code:

Getting-the-form-iFrame-code

If you are using the iFrame method and you still experience this issue, please provide the link to your page so we can have a look.

Thank you!

Thanks for getting back. Forms aren't embedded using an iFrame in Storyline. They have to be inserted in what what they call a 'Web Object'.

The scrolling works fine on a desktop/laptop computer but doesn't on an iPad or iPhone.

I've put together a demo here: http://www.greymattertraining.co.uk/scrolltest/story_html5.html

If you look via your desktop (PC or Mac) then an iPhone you'll see what I mean.

Thanks

I checked the demo you have provided (http://www.greymattertraining.co.uk/scrolltest/story_html5.html) on both Pc and iPhone emulator. The scrolling works fine on both device on my end.

PC:

iPhone emulator:

Are you still experiencing the scrolling issues on your end? If yes, you can try to use other embed methods and see which works best on your site. 

Regards.

Hi again,

Curiously although it seems to work on an emulator it doesn't seem to work on an actual iPhone. I'm using an iPhone 7 Plus and there's no scrolling.

Kind regards,

Tony

Hi Tony,

Unfortunately, this may also depend on the actual web builder you have and how responsive it is on different mobile devices. The form itself is responsive and can be viewed properly on different devices using the direct form link. 

However, if you embed it on a website, the form may not behave as usual as it is dependent on the parent element where it is embedded. In your case, it depends on how Articulate Storyline 3 handles responsive design. I searched the web and I found similar cases for Articulate Storyline, seems to be specific to iOS, you can check the links below:

General discussion about responsive design: https://community.articulate.com/discussions/articulate-storyline/responsive.

Web object scaling/resizing: https://community.articulate.com/discussions/articulate-storyline/web-object-sizing-scaling

Scroll bar issues using Web Objects:

https://community.articulate.com/discussions/articulate-storyline/scroll-content-of-a-webobject-in-html5-version-on-safari-for-ios 

https://community.articulate.com/discussions/articulate-storyline/scroll-bar-help-for-web-object-storyline-360 

https://community.articulate.com/discussions/articulate-storyline/scrolling-lost-in-web-objects-on-ipad 

I suggest contacting the support team in Articulate as it seems like a known issue.

I hope that helps.

Thank you for that. From the links you've sent think you're correct that the problem is with Storyline. I've therefore raised this as an issue on their forum.

many thanks again for your excellent service.

Tony