SCORM content not responsive in small devices

SCORM content not responsive in small devices

by Fernando Moreno -
Number of replies: 5

Hi, 

I am using some adaptive and responsive SCORM content in my courses produced with Elucidat. Responsiveness seems to fail when using small devices such as iPhone 5, SE, etc. It is certainly a problem related to Moodle, as the same content can be displayed correctly in Scorm Cloud. 

I have tried it with different themes and by changing the css  #page-mod-scorm-player #scormpage div.yui3-u-1-24  { display: none; padding:0;}, which makes the wrapper page almost disappear. But the issue is still there.

Can anyone help me with this? Should it be considered a bug in Moodle? Thank you!!

Attachment online-link.PNG
Attachment without-mobile-app.PNG
Average of ratings: -
In reply to Fernando Moreno

Re: SCORM content not responsive in small devices

by Fernando Moreno -

I believe that this issue is being addressed (https://tracker.moodle.org/si/jira.issueviews:issue-html/MDL-46563/MDL-46563.html) but not resolved. It seems awkward that it has being assigned a "minor" level of priority, when this is affecting almost every SCORM content created by main authoring tools: Articulate, Lectora, now Elucidat, ... 

Average of ratings: -
In reply to Fernando Moreno

Re: SCORM content not responsive in small devices

by Merlijn Knol -

Dear Fernando,

I found this message when I was searching online for a solution, as I'm facing the exact same problem with mobile responsiveness. 
Was your issue ever resolved? 

Looking forward to hearing from you,

Merlijn

Average of ratings: -
In reply to Fernando Moreno

Re: SCORM content not responsive in small devices

by Franco Pomidoro -

Hi, we found this post searching about this issue and posible solution.


As stated, there seems to be no official solution:


We managed to workaround this issue with a small jquery script for now .


We add the following snippet just before the </body> tag in the layout file the SCORM player is using. For example "embedded.php" for the pop-up window.


<script>
function resizeme() {
    $('#scorm_layout').height($(window).height());
}

$( document ).ready(function() {
    $( window ).resize(function() {
        setTimeout(resizeme, 1500);
    });
});
</script>

It just set the height for #scorm_layout to whatever the window height is. It works with a timeout because Moodle seems to be doing the same on resize but always changing it to a fixed number. 


DISCLAIMER: this was tested on Moodle 3.5 with a modified Gourmet theme. I cannot state it works in every situation.


Best!

Average of ratings: Useful (1)
In reply to Franco Pomidoro

Re: SCORM content not responsive in small devices

by Dan Marsden -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers Picture of Plugins guardians Picture of Testers Picture of Translators

Thanks for sharing the hack! -  it would be really nice if someone could develop a patch for core that tidied up the window height that doesn't require the timeout - if you get round to this please add it to https://tracker.moodle.org/browse/MDL-62057 and I'll help to get it into the core release!

Average of ratings: -
In reply to Dan Marsden

Re: SCORM content not responsive in small devices

by Baz Pope -

Hi Guys

Have you heard any news on this one?  I've recently created a Moodle instance which will be accessed on large and small devices, which looks great on a desktop and then simply refuses to resize to the height of a screen on a mobile.  It's a real shame as it's otherwise pretty good.

I've tried including the JS suggested but it just doesn't seem to make any difference for me.  I tried including it in the additional JS section for the theme, any reason why that should/shouldn't work?

Cheers smile

Average of ratings: -