2013-02-11 6 views
9

Ich habe Probleme beim Laden einer PDF in einem iframe in IE mit fancybox. Wenn ich auf den Link klicke, bekomme ich den Gif Loader und er dreht sich für immer. Keine Fehler in der Konsole oder auf der Seite oder ähnliches. Problem tritt in allen Versionen von IE auf. Alle anderen Browser funktionieren einwandfrei. Außerdem ist das PDF eine interne Datei.Fancybox hängt Laden iframe in IE

Hier ist ein Teil des Codes:


HTML

<!DOCTYPE html> 
    <html lang="en"> 
    <head> 
     <meta charset="utf-8"> 

     <link rel="stylesheet" type="text/css" href=<?php echo base_url("templates/style1/css/jquery.fancybox.css") ?> /> 

     <script src=<?php echo base_url("js/jquery-1.7.2.min.js") ?> type="text/javascript"></script> 
     <script type="text/javascript" src="../js/jquery.fancybox.js"></script> 

    </head> 
    <body> 
     <a class="fancybox-media italic" href="../contract_docs/dummy.pdf" >Test Doc</a> 
    </body> 
</html> 

JS

$(document).ready(function(){ 
     /* fancybox handler */ 
     $('.fancybox-media').fancybox({ 
      openEffect : 'none', 
      closeEffect : 'none', 
      autoSize: true, 
      type : 'iframe' 
     }); 
    }); 

EDIT: ich auch jQuery versucht haben, ein Upgrade, ohne Erfolg.

EDIT: Hier ist ein jsFiddle, wirklich einfach und funktioniert nicht in IE für mich.

Antwort

19

Es scheint wie Vorbelastung zu deaktivieren behebt das Problem mit iframes und IE dies so versuchen:

$(document).ready(function() { 
     /* fancybox handler */ 
     $('.fancybox-media').fancybox({ 
      openEffect: 'none', 
      closeEffect: 'none', 
      autoSize: true, 
      type: 'iframe', 
      iframe: { 
       preload: false // fixes issue with iframe and IE 
      } 
     }); 
    }); 

mit fancybox v2.1.4 und IE7 getestet.

prüfen JSFIDDLE

+1

Funktioniert wie ein charme! Vielen Dank, konnte die Lösung nirgends finden ... – Falantar014

+0

Ehrfürchtig, danke. Dito, funktioniert wie ein Zauber. Ich benutze fancybox 2.1.4, mit JQuery 1.7.1 und getestet gegen IE9 und IE10. – arcseldon

+2

"preload: false" behebt ein Problem mit Android 4.1.2 Stock Browser (Mobile Safari). Vielen Dank! – Jurgen

-1

i gerade testen Sie Ihr Snippet-Code und es funktionierte für mich in IE 8 und Chrom

i verwenden Ressourcendateien aus:

jquery: http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.min.js

js: http://fancybox.net/js/fancybox-1.3.4/jquery.fancybox-1.3.4.js

css: http://fancybox.net/js/fancybox-1.3.4/jquery.fancybox-1.3.4.css

verwendeter Code:

<!DOCTYPE html> 
<html lang="en" >  
    <head> 
     <meta charset="utf-8"> 

     <link rel="stylesheet" type="text/css" href="http://fancybox.net/js/fancybox-1.3.4/jquery.fancybox-1.3.4.css" /> 

     <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.min.js" type="text/javascript"></script> 
     <script type="text/javascript" src="http://fancybox.net/js/fancybox-1.3.4/jquery.fancybox-1.3.4.js"></script> 
     <script> 
      $(document).ready(function(){ 
       /* fancybox handler */ 
       $('.fancybox-media').fancybox({ 
        openEffect : 'none', 
        closeEffect : 'none', 
        autoSize: true, 
        type : 'iframe' 
       }); 
      }); 
     </script> 

    </head> 
    <body> 
     <a class="fancybox-media italic" href="pdf.pdf" >Test Doc</a> 
    </body> 
</html> 


maybe clear browser cach fix it 
+0

ich Kopieren/Einfügen Sie Ihren Code (und änderte den pdf) und alles, was ich bekommen, ist ein Fehler in der Konsole: SCRIPT438: Objekt unterstützt keine Eigenschaft oder Methode ‚fancybox‘ – Falantar014

+1

der OP verwendet fancybox v2.x – JFK

+0

es ist nicht aus dem code, es geht um fancybox js, code oben gearbeitet –