fancybox-1.3.4 doesn't work in iE8

Question

I have following sample of code i want to open video in a fancybox it works fine almost across all browsers except when i try to test it in IE 8 standard mode.

It works fine in IE 9 and above.

Based on this solution i added following line of code but this doesn't make it work either iframe: { preload: false }

HTML Deceleration code is as

<!DOCTYPE html >
    <html lang="en">
    <head id="Head1" runat="server">
    <title></title>
    .........

Sample Code

<div class="video-icon">
  <a href="http://www.youtube.com/embed/CR0AXNtwqZE?autoplay=1" class="fancybox-video"><img src="coorporate-video-icon.jpg"/></a>
</div>


             $("a.fancybox-video").fancybox({
                width: 600,
                height: 440,
                closeClick: true,
                hideOnOverlayClick: true,
                type: 'iframe',
                iframe: { preload: false // fixes issue with iframe and IE
                }
            });

I am not sure what breaks it i cant create a fiddle example as fiddle doesn't work in IE 8 any help in this regard is appreciated.

UPDATE: i tried it with fancybox Version 2.1.3 but i still face the same problem..

Why don't you use Fancybox 2 ? Fancybox 1 is discontinued for some days. — Raptor, Jan 07 '14 at 04:13
The solution in [this post](http://stackoverflow.com/questions/14819642/fancybox-stuck-loading-iframe-in-ie) is for fancybox v2.x. Fancybox 2.x options are incompatible with v1.x — JFK, Jan 07 '14 at 04:20
@ShivanRaptor : the reason people may not want to use v2.x is because its license limitations so they prefer to stick to v1.3.4 (which it's not discontinued) — JFK, Jan 07 '14 at 04:21
Guys I want to use the free version without any license issues. for this reason i am using fb-1.x.x — Learning, Jan 07 '14 at 04:23
@JFK, is their any fix for this in if one is using version 1.3.4 or only option is v2. I would appreciate your reply on this — Learning, Jan 07 '14 at 04:25

score 1 · Answer 1 · edited Jun 20 '20 at 09:12

1

it doesn't work doesn't really tell what the problem is.

If it didn't even work with v2.1.3, then you may have other issues. This is your check list for troubleshooting IE:

Make sure you have a proper DOCTYPE, and the DOCTYPE is the first line of your html document so IE won't switch to quirks mode.
Make sure you are wrapping your custom script inside the .ready() method.
Make sure you are using the right fancybox options
Make sure you don't have any extra trialing comma after the last option
Check for other script conflicts (syntax errors of other scripts may stop fancybox from working)
Make sure you don't have any other js error. Check IE isn't showing this icon (bottom-left corner of the browser) :

Otherwise, this html

<a href="http://www.youtube.com/embed/CR0AXNtwqZE?autoplay=1" class="fancybox-video"><img src="coorporate-video-icon.jpg"/></a>

and this jQuery code, both work fine in IE[7-9] using fancybox v1.3.4 :

jQuery(document).ready(function ($) {
    $("a.fancybox-video").fancybox({
        width: 600,
        height: 440,
        hideOnContentClick: true, // closeClick: true, // this for v2.x
        hideOnOverlayClick: true,
        type: 'iframe'
    });
}); // ready

See DEMO at http://www.picssel.com/playground/jquery/youtubeEmbedIframe_07jan14.html

edited Jun 20 '20 at 09:12

Community

1
1

answered Jan 07 '14 at 20:06

JFK

40,963
31
133
306

I solved issue by using Jquery 1.9.x along with Fancybox V2 as it come with the theme which i had purchased. I tried to fix issue with fancyboxv1.8.3 but it kept on generating issue due one or other reason. Error was also due to use of `browser.msie` in FB detection which generated following error 'jquery-1.8.3.min.js, line 2 character 59313` .. So lesson learn use the correct js file when using plugin... also other error `TypeError: $.browser is undefined` ... – Learning Jan 08 '14 at 06:03
I finally changed to fancybox v2 after few changes i managed to make it work. in IE 8 i have not tried it with IE 7 as i am not planning to support IE 7 otherwise i might have to drop of useful features which might not work well in IE 7. so far support for IF 8 is more than enough and we still have small number of user for IE 8. Regarding using fancybox v1 i noticed that fancybox.js had some support problem with jquery 1.8.3 regarding use of nth element may be that was creating some sort of conflict so i am now using jquery 1.9.x and fancyboxV2 as it comes part of theme purchase.. – Learning Jan 08 '14 at 06:05
For the record, my demo uses jQuery 1.8.3 + fancybox v1.3.4 and works just fine in IE. You may know that fancybox v1.3.4 doesn't work with jQuery v1.9+, you can see a work around here http://stackoverflow.com/q/14344289/1055987 though – JFK Jan 08 '14 at 07:40

fancybox-1.3.4 doesn't work in iE8

1 Answers1