AnythingSlider – ie7 errors in video js

[silverliebt]

I ran my little anything slider project through ietester and then again on browserstack.com, and am receiving some errors that point to the file jquery.anythingslider.video.js:
1. Syntax error (line 117) (jquery.anythingslider.video.js)
2. Object doesn’t support this property or method (line 116)(jquery.anythingslider.video.js)
3. Syntax error (line 117) (jquery.anythingslider.video.js)

Line 117 is just a semicolon.
Line 116 is:
$vid[0].contentWindow.postMessage(data, $vid.attr(‘src’).split(‘?’)[0]);

Any help very much appreciated.
My url for the mockup (work in progress) is:
http://silverthreaded.com/dev/nextup/slider/nextup06.html

[Mottie]

Hi Silverliebt!

The error is from the “postMessage” function. It’s a function that isn’t available in IE7, but is needed to communicate with the iframe to make the video play, pause and update the status.

If it is causing problems, you could wrap the script in a conditional comment like this:

[silverliebt]

I’m not sure I understand. Serving the video js via conditional comment is still serving it to IE7 and still producing the error. Should I serve a *version* of jquery.anythingslider.video.js to IE7 that is *modified* (e.g. commenting out this part of the code in another version of the file saved to something like jquery.anythingslider.video.ie.js or something like that? I wasn’t sure if you were suggesting serving a modified version of the file or just serving the same file via conditional comment. Could you help clarify this for me? Thanks so much for your help Mottie!

[silverliebt]

If not clear before I’m receiving the error in IE7. Your response seems (I think) to assume I was receiving the error in other browsers, if I’m not mistaken. So basically the fix for IE7 — code comment is: “// postMessage to iframe – http://benalman.com/projects/jquery-postmessage-plugin/ (FOR IE7)” — is actually causing errors in IE7. Does that make sense?

[Mottie]

Oops sorry, I did that backwards… try this instead

[silverliebt]

Thanks Mottie, error gone. Two small follow-up questions: I haven’t seen the use of before after the if statement & before the call to the file. Does that do something special that traditional conditional comments do not? Also noticed that, though no errors, IE7 and IE8 continue to play a started video when the slider has advanced to a new panel. In Chrome, FF and IE9, the prior (started) video pauses on slide advancement. Is that expected behavior? Any workarounds there?

Thanks again. BTW I really enjoyed the extra themes you made.

[Mottie]

That conditional statement is a bit convoluted, basically IE sees the conditional comment, and if it is false, it ignores everything between the opening and closing conditions. So to make it work in non-IE browsers, you basically close the comment (initially), then reopen it just before the closing conditional. I always seem to mess it up, so I just copy it from the HTML5 boilerplate if I forget.

On the second question. Because IE7/8 do not allow communication between the current page and an iframe, there is no way to pause the video. So, in this case, you might want to revert back to the original youtube video embed code (embed, not iframe) to make the video pause.

[silverliebt]

As I suspected on both counts; thanks much for the explanations. I had a feeling we might need to resort to embed code. Thanks too for the link to the boilerplate, much appreciated! Paul Irish is awesome; I follow him on twitter. [Chris is more awesome still though, for my money… :) For instance, when he did that “let’s suck at github together” screencast – so many geeks take themselves way too seriously…]

[Author]

Posts