Adapt Learning Community: Icons in IE 10+

I'm testing a scorm course developed using v2 of the framework, which has been uploaded to Blackboard.

When viewing in Blackboard on IE10 and IE11 the various icons seem to drop out - so for example I don't get the cross for closing a modal, the navigation arrows in a narrative slider and so on. This doesn't happen on Chrome or Firefox - so I'm assuming it is at least something browser related.

My course config has legacy browser support set to 'true'. Is there a fall back that's supposed to kick in but isn't? Or is this expected behaviour?

Thanks

What about if you view via another LMS (e.g. SCORM Cloud) or web server?

The icons are actually glyphs in a web font file so this suggests that the file type (.ttf??) that is used by IE10/11 is being blocked.

If you use the web developer tools built into IE you should be able to inspect the files being loaded by the course to see if any are failing to load.

Show parent | Reply

Well, weirdly your '.ttf??' was completely prescient.

When inspecting the files being loaded I saw a request for '/adapt/css/fonts/vanilla.eot?' (i.e. including the question mark - screenshot attached).

Looking in the CSS I guess this comes from the @font-face ('fonts/vanilla.eot?#iefix'). I gather this is a standard workaround for IE issues.

Removing the ?#iefix my updated SCORM pack worked fine in Blackboard. The font now being loaded was 'vanilla.eot' (no question mark) and the icons displayed.

This does leave me with a couple of questions:

- Does this seem likely to mangle things in earlier versions of IE? (Not too bothered about that.)

- Is this something that needs to be fixed in the framework? Or is it some weird thing that's very specific to what I've done and/or to what Blackboard's doing?

I guess I may also need to read up on what supportLegacyBrowsers is up to as well. If I switched that to 'false', I'm guessing that means it won't build in things like this IE fix?

Show parent | Reply

Ah, c***. Looks like that was a red herring - still having the same problem.

(Probably got mixed up between my chrome and IE popups and fooled myself into thinking I'd fixed it!)

That does explain why it's not flagging that it didn't get the font file. So maybe something else is going on...

Show parent | Reply

This explains why #iefix is used.

_shouldSupportLegacyBrowsers is only relevant to accessibility.

Did you try on another LMS/webserver? SCORM Cloud is free to use for the purposes of testing things like this.

Show parent | Reply

Now had a chance to test in SCORM cloud and also on CourseSite. In both cases the icons appear exactly as they should, without any problems, in IE11.

Which I guess suggests the issue may be more specifically related to Blackboard in my institution!

Show parent | Reply

Suspected that might be the case. I'd still be inclined towards something at the server level blocking these, though it's strange that you're not seeing anything to that effect in the console...

IE11 supports both EOT and WOFF - but I'm not sure which it would use in the event that both are supplied... I suppose you could try removing the EOT definition from icons.less in the theme?

Show parent | Reply

Update on this in case anyone encounters a similar issue in Blackboard. After investigation, our VLE experts came up with the following fix:

- After uploading the Adapt SCORM in Bb, go to the 'Advanced Options' for Scorm behaviour.

- In Launch behaviour set the SCO Launch type to Frameset, and the Player Launch type to New window (i.e. reversing what in most cases will be the default).

- Submit/save this change.

After doing this in our Blackboard system the icons appear as the should on IE10/IE11.

Our VLE support team are following-up with Bb to understand why this was happening. If I get an update I'll certainly report back!

Show parent | Reply