Streaming live at 10am (PST)

Background video locks up Internet Explorer


#1

I’m having an issue with background video in Internet Explorer 11. The video plays fine in Chrome. It also plays fine on my machine (Windows 10). On other computers in our office, the video freezes in IE 11.

I tried adding some jquery to remove the video if using IE 11 and display a background image instead. This seemed to be a good solution for some computers, but we found one machine that would lock up IE (not responding) on the homepage every time. If I deleted the video completely and republished, that machine/browser no longer locked up.

If you can provide any advice, I would greatly appreciate it.

Here is my site Read-Only: https://preview.webflow.com/preview/nppd?utm_source=nppd&preview=6b4f02cc2d0f9bfd39c93b98a368a224

Here is the published version: http://redesign.nppd.com (I temporarily commented out the code to remove the video as that doesn’t seem to be a workable solution)


#2

I just made a new discovery. This is only happening when visiting the site through https (https://redesign.nppd.com).

It is NOT happening at https://nppd.webflow.io
The video still freezes but the browser doesn’t lock up when you click a link.

I’m not as concerned that the video won’t play in IE 11 (on most machines). My main concern is why does IE become non-responsive on this one machine when:

  • visit the site over https
  • homepage has background video
  • click on a link

#3

Hi @mpdoern

Just a quick reply to say we will look into this shortly.

Thanks
Stu


#4

Hi @mpdoern

Thanks for posting.

These kinds of issues are very tricky to resolve as there are quite a few variables here to consider. Based on your explanation, It sounds like this is an issue with that machine and / or network connection. If the page is loading as expected on all other machines except this one, it’s unlikely we will be able to find or push a fix from this end.

The other consideration here is that Webflow writes HTML5 and CSS3, some of which isn’t fully supported by IE11. Since Microsoft no longer updates this browser, and they have plans to halt support altogether, it makes it that much more difficult to address an issue like this.

If you use another browser like Edge, or Chrome on that same machine, does the page load okay?


#5

Yes, I believe the other browsers on that machine work just fine.

It’s odd that it is only locking up under the https protocol though. It could be a combination of IE 11, our network, https and maybe that this computer is in a conference room displaying on a large screen. Difficult to say.

Although only a smaller percentage of our audience uses IE11, we can’t possibly use background video if it has the potential to lock up and crash the browser. Do you have any other suggestions? As I mentioned, I tried removing the video with jquery, but that doesn’t help.


#6

@mpdoern

It’s a long shot, but you may be able to get away with using an embed and some custom HTML/CSS to recreate a background video using custom code. This different approach may allow that machine to render the video as expected, but it’s hard to say for sure :thinking:


#7

Thanks, I may give that a try.


#8

Awesome, please let me know if it helps! In the mean time we’ll keep our eyes open for other errors like this :bowing_man:


#9

I did an embed as you suggested and copy-pasted the exact code that Webflow had written.

I discovered that the webm video format is not compatible with IE11 so I removed that source and it worked!

Then I tried adding it back in but listing it second (after mp4) and that worked too!


#10

Excellent! :tada:

Happy to hear you found a solution :slight_smile: