Hiding elements in SCORM XBlock

[romeoobane]

Hi all!

We would like to hide the points and Fullscreen button in the SCORM XBlock below.

We can’t access the iFrame elements below since this LTI Course is hosted from a separate domain and will result to CORS domain issue.

We can hide the score labels if we don’t allow scoring in the Advance settings, but we do need to record the scoring.

Just wondering of other options that we can explore, maybe some SCORM XBlock template that we can edit?

Thank you in advance.

[nachham]

Hi

Just add a raw html underneath the scorm module in which you add a css snippet that renders the button hidden or invisible. (You need to check the name of the css class of the button.)

Thanks

[romeoobane]

Hi @nachham,

Thank you for your response.

The scorm-xblock is hosted by Open edX LTI provider and I don’t have an idea to access the Scorm module on which I can add the suggested raw html to access the html elements like the Fullscreen button.

Since this scorm-xblock is hosted from another domain, accessing the iFrame elements will trigger a CORS security issue.

[nachham]

You don’t even have to reach to scorm module… I meant you should add a RAW HTML in Studio underneath the block and add the following css

 <style type='text/css'>

.openedxscorm_block .scorm_button {
    padding-bottom: 20px;
    visibility: hidden;
}

</style>

[romeoobane]

Brilliant @nachham, this works, I just know how to add a Raw HTML in studio that can access other unit HTML elements.

On the LTI launch, I just have to use the Vertical block so that both the Scorm and Raw HTML contents can be loaded.

Thanks again for the help, I really appreciate it.