Web Object Sizing-Scaling

Hi, when publishing the course as HTML5, content that is linked to the web object does not scale (resize) when viewed on an iPhone or iPad. See attachment. We cannot require that our learners use the mobile player app. Any ideas how make content scale in the web object when viewed on an iPhone or iPad? Thanks

Hi Tim! 

Are you viewing the HTML5 content in Safari? That would be the supported environment.

Would you be able to share a sample .story file for us to take a look and better understand?

Hi, yes, I'm viewing the HTML5 in Safari on an iPad and iPhone. Sorry, we're not permitted to share this type of content. It looks fine in Windows (IE, Chrome, and Safari) or on an iMac. When viewing the course that contains a web object on an iPad or iPhone, the web object does not resize or scale. Thanks

Morning, Tim.  Let me ask a couple of things:  When you are viewing the course on a desktop, are you specifically testing the HTML5 content?  Either you could launch directly from the HTML5 launch file, or disable Flash in an HTML5 supported browser (see "Viewing Content").

Also, does this behavior occur with any web object?  Or is it specific to the build-a-baconator object?

Crystal, we tried testing both Flash and HTML5 versions on all devices. It seems that we have narrowed the issue to iOS (and even Mac OSX to an extent). The Phaser game accessed from the web object works fine on Android devices and Windows-based machines.  Please let me know if you have any ideas. We're getting into the weeds and not seeing easy fixes yet. I'll let you know if we have more discoveries. Thanks, Tim

Hi Tim!

I'm seeing that a similar issue has been reported to our QA Team related to Storyline 1. Is that the version that you are utilizing as well?

We are using Storyline 2. Thanks, Tim

Thanks for the update Tim! I was able to utilize another course where a similar issue was reported and verify that this is still occurring in SL2 as well. I will update our QA Team and share this link as well.

Leslie, please let me know if your team has a fix, as we are about to release all new courses for our sandwich curriculum. The courses contain games that are used to test knowledge. iOS users will not be able to view the games or complete the courses due to this issue. Thanks

Hi Tim,

Unfortunately we don't have an update to share, and we don't offer timelines in regards to fixes or updates, so in the meantime you may want to look at setting the web object to open in a new window/tab so that when the user is on an iPad they'll be able to access it. 

Hi Ashley, unfortunately that approach does not enable Apple users to view this material. Based on other forum entries, it looks as if this issue was identified about three years ago. Since this has been an issue for awhile, perhaps Articulate could place a higher priority on a resolution. Thanks for the suggestion.

Hi Tim,

Sorry I don't have further information to share, but I've certainly included your comments here in the report filed. With the web objects opening in another tab/window - the users aren't able to view it on iOS devices? Do you receive an error message or something similar? 

Ashley, iPad and iPhone users see no error when viewing the web object. When publishing the course as HTML5, content that is linked to the web object does not scale (resize) when viewed on an iPhone or iPad.  See attachment.  Interestingly, when linking to the same content from a web object in an Adobe Captivate project, the web object scales appropriately for iPad and iPhone users. It would seem that Captivate handles iframes differently than Storyline. Thanks

Hi Tim,

Sorry for my confusion - the web object you're including can't be viewed even in a new window/tab on iOS devices? I don't know much about Captivate's content, or how they handle iFrames but perhaps someone in the community will be able to chime in here to share specifics. 

Ashley, thanks for the quick response. I'm hopeful there is a resolution in the near future.

Tim,
We will definitely keep you posted and please let us know if you need
anything else!!

In the "For What it's Worth Department", here's a work-around for our web-object issue.

See attached screenshot for results.

In the Storyline 2 output “mobile” folder, make the following changes to the “player_compiled.js” file:

Change
<iframe class='item webobject'>
To
<iframe class='item webobject' scrolling='no'>

Change
<iframe class='item webobject unhideable'>
To
<iframe class='item webobject unhideable' scrolling='no'>

The Phaser game (Storyline web-object) sized correctly inside the Storyline player when scrolling was turned off in the “player_compiled.js” file. 

The Phaser game (Storyline web-object) sized incorrectly outside the Storyline player when scrolling was not defined in the “player_compiled.js” file.

Thanks,
Tim

I hope that you will give up flash in the near future!

Hey there, Erik.  I just wanted to acknowledge your frustration with Flash...I think we've all felt it at one point or another.  But we hear you and thank you for taking the time to give your input!

Ditto about Flash.

Keep in mind that we modified the “player_compiled.js” file that resides in the "mobile" folder to fix the issue. To my knowledge, that's HTML5, Javascript... not Flash.

Thanks

Tim,

you are right. Nevertheless I have the impression, that Articulate will refer us to Flash and the Mobile Player, when there is any HTML5 problem, as long as they still have Flash as a fallback.

Hi Tracey,

Thanks for sharing that idea! This discussion is a bit older, and pre-Articulate 360 with our new responsive player. Have you taken a look at using Articulate 360 or the standalone Storyline 3? 

I'm using Storyline 360 and the web objects aren't scaling.

Hi Stephen and welcome to E-Learning Heroes :)

Thanks for reaching out and letting us know what you are experiencing with your course.

This thread is a bit dated and it looks like the issues were from previous versions.

• Would you be able to share a sample of your .story file so that we can take a look? 
• What environments/browsers are you noticing an issue in?