cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 
mmallon
Community Member

SCORM Height Sizing Issues

I've run into a couple of issues with the height of SCORM assignments that are a pretty big impediment to the courses that I'm working on.

1) The .tool_content_wrapper height of the containing iframe in Canvas is often much too large for my SCORM content. It seems like Canvas is dynamically setting this number using javascript, and I was wondering where this number is coming from and if it could be made smaller. At the moment, there's such an exorbitant amount of whitespace beneath the content that it appears to students that content is missing from the page that wasn't loaded properly.

2) Dovetailing into the first issue is that, although I am successfully able to send a postMessage to Canvas to resize the iframe to the SCORM content's actual height (allow external tool to resize iframe · instructure/canvas-lms@834aba7 · GitHub ), the content area is not being repainted after my postMessage is sent. This is a little tricky to explain, but I'll do my best. Going back to my first point, the original size of the iframe is much too large. So, inside of the html page I'm serving my SCORM content on, I've sent a postMessage to Canvas after my content has loaded, to set the height of the containing iframe for my content. The containing iframe successfully changes to the proper size. However, the larger space that the iframe originally took up does not get repainted. There's a large expanse of whitespace beneath the SCORM frameset where the original iframe was originally painted. I don't seem to have this issue with any LTI tools I've created or used, but maybe I've just been lucky. I know that SCORM is technically being served in an LTI wrapper. I'm curious if the issue might have to do with SCORM being served in a frameset instead of just an iframe, like an LTI tool, or if there's some other issue at play that Canvas could potentially fix.

As an example, here's a screenshot of what I'm talking about with the whitespace not being repainted. Just to make the issue super clear with a bit of an exaggeration, I uploaded a SCORM package where the height I'm sending in the postMessage is just 30px. The sliver of dark blue in the screenshot is my SCORM tool. Yet the height of the content area is still huge, from where the iframe/frameset was originally painted. (And just to anticipate a possible question...yes, the height that is painted here in the content area is not due to the min-height of 450px for #main. I can see in dev tools that the whitespace that appears is much taller than 450px.) This vast expanse of whitespace is obviously an issue for the look of the page. It might not always be as exaggerated as my example, but I've had issues with run-of-the-mill SCORM exports where hundreds of pixels of whitespace was appearing that should not be there.

Screen Shot 2015-05-15 at 12.32.05 PM.png

This seems like more of an issue for Canvas than something that I could fix on my end, but if anyone has ideas, I'd sure appreciate it. Thank you!

Labels (1)
Tags (3)
12 Replies
broxholm
Community Participant

I have something similar but mine is not height but width.  I have learning modules created in PowerPoint and converted to SCORM using Articulate.  When my SCORM loads the iframe width is only about 2/3 the width of my learning module. I wish Canvas would allow adjustment of the windows like I can do in Moodle.

elaine_h_chen
Community Participant

My issue is about the Captivate SCORM height as well. Is there a work-around?

broxholm
Community Participant

What are you using to create your SCORM?  In Articulate there is an option to have your SCORM open in a new window.  If you choose this option your SCORMS won't be limited by the default sizes of the iFrame in Canvas because they will open in their own browser window. 

elaine_h_chen
Community Participant

Sorry I didn't specify. I used Captivate 9 to create the SCORM zip folder and using Canvas SCORM to upload the file. It is a Canvas.net course for our MOOC. Below is the screenshot, you can see that there is a scroll bar on the right, 1/3 of the project is not shown. Please help! Thank you so much!

Screensot of Captivate display heigh in Canvas

broxholm
Community Participant

I went looking for a setting in Captivate to open in a new windows.  I don't have Captivate so I was unable to poke around looking for it.  I did find these two articles on line. How to publish SCORM content in Adobe Captivate  and Publishing Captivate 8 and 9 SCORM content – Mindflash  one setting that might work for you is called "Scalable HTML Content"  there is also a method to adjust the output size.  Maybe you can match it to the iframe size in Canvas.  Isn't Canvas fun......?

elaine_h_chen
Community Participant

Hi Thomas, thank you, you are really good! I did have success publishing SCORM using full screen for none responsive design (See the publish setting in screenshot 1). And now I am working on responsive design and the publish setting doesn't have that option (See screenshot 2. This image shows the responsive devices on the top of the image). It might be the Captivate issue and not necessary the Canvas issue.

Screensot of Captivate publish setting full screen

Screensot of Captivate publish setting no full screen

broxholm
Community Participant

I would suggest using the newest SCORM standard of SCORM 1.2 instead of SCORM 2004.

elaine_h_chen
Community Participant

I tried both, it's the same. It won't fix the height issue. Thank you for all your time! I will keep researching. Our course will be live on Monday, and there are 14 Captivate activities in the course. 😞

stuart_ryan
Community Coach
Community Coach

Hi mmallon,

I am going through having a look at some of the early days in the Canvas Developers group, and checking in to see if older enquiries have been answered. I also noticed there hasn’t been any discussion on this question in quite some time.

I am wondering, were you ever able to resolve this? I am hoping I can assume that it is well and truly resolved by now, but if not, please let us know and we can certainly have another look. Alternatively, if have some insights you may be able to share for others that would be awesome too!

I will mark this as assumed answered for the time being, however, by all means please let us know if you still have an outstanding question and we will take a peek!

Cheers,
Stuart