web-dev-qa-db-fra.com

Fancybox ne fonctionne pas avec jQuery v1.9.0 [f.browser n'est pas défini / ne peut pas lire la propriété 'msie']

Fancybox rompt avec le nouveau jQuery v1.9.0.

Cela concerne à la fois Fancybox v1.3.4 et inférieur - et - v2.1.3 et inférieur.

Les erreurs montrées sont:

v1.3.4:

Timestamp: 15/01/2013 10:03:28 AM
Error: TypeError: b.browser is undefined
Source File: ...fancybox/jquery.fancybox-1.3.4.pack.js
Line: 18

... autres erreurs

Uncaught TypeError: Cannot read property 'msie' of undefined jquery.fancybox-1.3.4.pack.js:18
Uncaught TypeError: Object [object Object] has no method 'fancybox'

En v2.1.3:

Timestamp: 15/01/2013 10:09:58 AM
Error: TypeError: $.browser is undefined
Source File: h.../fancybox2.1.3/jquery.fancybox.js
Line: 139

Si vous utilisez ceci pour appeler jQuery:

<script src="http://code.jquery.com/jquery-latest.js"></script>

... toute implémentation de votre fancybox existante échouera !!

jqueryfancyboxfancybox-2
100
JFK

Il semble qu'il existe un bogue dans jQuery signalé ici: http://bugs.jquery.com/ticket/1318 qui rompt le script Fancybox.

Consultez également https://github.com/fancyapps/fancyBox/issues/485 pour plus de détails.

Pour contourner le problème, revenez à jQuery v1.8. pendant que le bogue jQuery est corrigé ou que Fancybox est corrigé.

UPDATE (16 janvier 2013): Fancybox v2.1.4 a été publié et il fonctionne désormais correctement avec jQuery v1.9.0.

Pour fancybox v1.3.4, vous devez toujours revenir à jQuery v1.8. ou appliquer le script de migration comme souligné par la réponse de @ Manu.

UPDATE (17 janvier 2013): solution de contournement pour les utilisateurs de Fancybox v1.3.4:

Corrigez le fichier jancy de fancybox pour le faire fonctionner avec jQuery v1.9.0 comme suit:

  1. Ouvrez le fichier jquery.fancybox-1.3.4.js (version complète, version non packée) avec un éditeur de texte/html.

  2. Trouvez autour de la ligne 29 où il est écrit:

    isIE6 = $.browser.msie && $.browser.version < 7 && !window.XMLHttpRequest,

    et remplacez-le par (ÉDITION 19 mars 2013: filtre plus précis):

    isIE6 = navigator.userAgent.match(/msie [6]/i) && !window.XMLHttpRequest,

    UPDATE (19 mars 2013): remplacez également $.browser.msie par navigator.userAgent.match(/msie [6]/i) autour de la ligne 615 (et/ou remplacez toutes les instances $.browser.msie, le cas échéant), merci joofow ... c'est tout!

Ou téléchargez la version déjà corrigée à partir de ICI (MISE À JOUR le 19 mars 2013 ... merci fairylee pour avoir signalé le crochet de fermeture supplémentaire)

NOTE: il s'agit d'un correctif non officiel, non pris en charge par l'auteur de Fancybox, mais il fonctionne tel quel. Vous pouvez l'utiliser à vos risques et périls;)

Vous pouvez éventuellement revenir à jQuery v1.8. ou appliquer le script de migration comme indiqué par @ Manu répondre.

199
JFK

Bonjour, ceci est dû à la nouvelle version de jQuery => 1.9.0

vous pouvez vérifier la mise à jour: http://blog.jquery.com/2013/01/15/jquery-1-9-final-jquery-2-0-beta-migrate-final-released/ =

jQuery.Browser est obsolète. vous pouvez conserver la dernière version en ajoutant un script de migration: http://code.jquery.com/jquery-migrate-1.0.0.js

remplacer:

<script src="http://code.jquery.com/jquery-latest.js"></script>

par :

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.0.0.js"></script>

dans votre page et son fonctionnement.

27
Manu

Les événements globaux sont également déconseillés.

Voici un correctif qui corrige le navigateur et les problèmes d’événement:

--- jquery.fancybox-1.3.4.js.orig   2010-11-11 23:31:54.000000000 +0100
+++ jquery.fancybox-1.3.4.js    2013-03-22 23:25:29.996796800 +0100
@@ -26,7 +26,9 @@

        titleHeight = 0, titleStr = '', start_pos, final_pos, busy = false, fx = $.extend($('<div/>')[0], { prop: 0 }),

-       isIE6 = $.browser.msie && $.browser.version < 7 && !window.XMLHttpRequest,
+       isIE = !+"\v1",
+       
+       isIE6 = isIE && window.XMLHttpRequest === undefined,

        /*
         * Private methods 
@@ -322,7 +324,7 @@
            loading.hide();

            if (wrap.is(":visible") && false === currentOpts.onCleanup(currentArray, currentIndex, currentOpts)) {
-               $.event.trigger('fancybox-cancel');
+               $('.fancybox-inline-tmp').trigger('fancybox-cancel');

                busy = false;
                return;
@@ -389,7 +391,7 @@
                        content.html( tmp.contents() ).fadeTo(currentOpts.changeFade, 1, _finish);
                    };

-                   $.event.trigger('fancybox-change');
+                   $('.fancybox-inline-tmp').trigger('fancybox-change');

                    content
                        .empty()
@@ -612,7 +614,7 @@
            }

            if (currentOpts.type == 'iframe') {
-               $('<iframe id="fancybox-frame" name="fancybox-frame' + new Date().getTime() + '" frameborder="0" hspace="0" ' + ($.browser.msie ? 'allowtransparency="true""' : '') + ' scrolling="' + selectedOpts.scrolling + '" src="' + currentOpts.href + '"></iframe>').appendTo(content);
+               $('<iframe id="fancybox-frame" name="fancybox-frame' + new Date().getTime() + '" frameborder="0" hspace="0" ' + (isIE ? 'allowtransparency="true""' : '') + ' scrolling="' + selectedOpts.scrolling + '" src="' + currentOpts.href + '"></iframe>').appendTo(content);
            }

            wrap.show();
@@ -912,7 +914,7 @@

        busy = true;

-       $.event.trigger('fancybox-cancel');
+       $('.fancybox-inline-tmp').trigger('fancybox-cancel');

        _abort();

@@ -957,7 +959,7 @@
            title.empty().hide();
            wrap.hide();

-           $.event.trigger('fancybox-cleanup');
+           $('.fancybox-inline-tmp, select:not(#fancybox-tmp select)').trigger('fancybox-cleanup');

            content.empty();
18
sabel

Si quelqu'un doit encore prendre en charge l'ancienne légende de fancybox avec jQuery 3.0+, voici quelques modifications à apporter:

. unbind () obsolète

Remplacez toutes les instances de .unbind par .off

. removeAttribute () n'est pas une fonction

Modifiez les lignes 580-581 pour utiliser plutôt la fonction .removeAttr() de jQuery:

Ancien code:

580: content[0].style.removeAttribute('filter');
581: wrap[0].style.removeAttribute('filter');

Nouveau code:

580: content.removeAttr('filter');
581: wrap.removeAttr('filter');

Ceci combiné avec l'autre correctif mentionné ci-dessus a résolu mes problèmes de compatibilité.

2
Robert_QSS