CODEWITHSUNDEEP
javascriptjqueryhtmliframevideo
Michael Ramirez
Michael Ramirez

Reputation: 247

Embedding Yahoo! Video Using IE11 Fails

I am trying to embed a video into html via iframe

<iframe width="100%" height="351" scrolling="no" frameborder="0"   src="http://finance.yahoo.com/video/playlist/cnbc-big-data/best-worst-housing-markets-132811012.html?format=embed&player_autoplay=false"></iframe>

This video works fine in Firefox. However, when I am trying to view the iframe embedded video in IE11 it does not work and instead gives me the message "You need Adobe Flash to play this video" -- this does work in IE11 if viewing from the original link though.

I cant seem to understand why this isn't working, I am hoping someone could help me with a solution!

Thanks

Upvotes: 1

Views: 910

Answers (1)

cgatian
cgatian

Reputation: 22984

It looks like when you embed the video into an iframe the source (Yahoo) incorrectly determines the browser type of the embedded frame in IE11. Looking through the Yahoo source they do some browser checking and even attempt to add a video tag into the markup. If these all fail the code says to use default, which is set to flash.

http://yep.video.yahoo.com/js/3/videoplayer-min.js?lang=en-US  


getRendererType: function (al) {
        var am = "html";
        if (f.Lang.isString(al.mobile) || f.Lang.isNumber(al.ios) || al.android > 0) {
            return am;
        }
        if ((navigator && navigator.userAgent) && ((navigator.userAgent.indexOf("MSAppHost") >= 0) || (/.+MSIE 10.+Windows NT.+WebView/i.test(navigator.userAgent)))) {
            return am;
        }
        if (this._fallBackTOHTML5(al)) {
            return am;
        }

        function Y() {
            return !!document.createElement("video").canPlayType;
        }
        if (this._preferHTML5 && Y()) {
            return am;
        }
        return this._defaultRenderer;

However changing the browser agent back to IE10, the render type is successful and the video displays.

IE10 Render

While its just a guess, but I bet the new user agent strings IE11 uses is somehow telling this video component control to incorrectly render. Unfortunately, there's just so much code in the video player its really hard to unravel.

Update: I've tried modifying the navigator.userAgent string to appear as IE10 without any luck Sample

Update2: I don't think it's a user agent string. It must be something with adding the video tag inside an Iframe in IE11. Modifying the user agent does fix it. Maybe it's a bit of both.

Sadly, I think you will just have to wait for them to fix the video control.

Upvotes: 2

Related Questions