jQuery fancybox 2 funktioniert nicht

Hallo zusammen,

contao 2.11.5, Scripte (moo_jquery_fancybox und moo_jquery_nc) sind eingebunden, werden im Quelltext auch ausgegeben. Es werden beide Frameworks geladen, der Aufruf im Textlink geht über href="{{link_url::70}}" rel="lightbox"
Allerdings wird die Seite im aktuellen Tab geöffnet.

Hab alle jQuery Versionen versucht, nichts funktioniert.

Bei deisem Bsp. http://www.internet-service-seo.de/0...uery-fancybox/
wird die lightbox so geladen: rel="lightbox[lb8]" Doch auch das klappt auch nicht...

Was kann das sein?

LG

Du musst im Template "moo_jquery_fancybox" den Aufruf auch anpassen

Code:

---

$("a[data-lightbox]").fancybox({...}

---

wird ja wohl kaum funktionieren :)
Versuch mal das hier

Code:

---

$('a[rel^="lightbox"]').fancybox({...}

---

Gruß

Hab das mal versucht, aber es hat nichts geholfen... Template sieht jetzt wie folgt aus:

Code:

---

<?php

//Include Fancybox2 JS
$GLOBALS['TL_JAVASCRIPT']['jquery_fancybox2_mousewheel'] = 'system/modules/jquery_fancybox2/html/fancybox2/lib/jquery.mousewheel-3.0.6.pack.js';
$GLOBALS['TL_JAVASCRIPT']['jquery_fancybox2'] = 'system/modules/jquery_fancybox2/html/fancybox2/source/jquery.fancybox.js?v=2.0.5';
$GLOBALS['TL_JAVASCRIPT']['jquery_fancybox2_buttons'] = 'system/modules/jquery_fancybox2/html/fancybox2/source/helpers/jquery.fancybox-buttons.js?v=2.0.5';
$GLOBALS['TL_JAVASCRIPT']['jquery_fancybox2_thumbs'] = 'system/modules/jquery_fancybox2/html/fancybox2/source/helpers/jquery.fancybox-thumbs.js?v=2.0.5';

//Include Fancybox2 CSS
$GLOBALS['TL_CSS']['jquery_fancybox2'] = 'system/modules/jquery_fancybox2/html/fancybox2/source/jquery.fancybox.css?v=2.0.5';
$GLOBALS['TL_CSS']['jquery_fancybox2_buttons'] = 'system/modules/jquery_fancybox2/html/fancybox2/source/helpers/jquery.fancybox-buttons.css?v=2.0.5';
$GLOBALS['TL_CSS']['jquery_fancybox2_thumbs'] = 'system/modules/jquery_fancybox2/html/fancybox2/source/helpers/jquery.fancybox-thumbs.css?v=2.0.5';

?>

<script type="text/javascript">
$(document).ready(function() {
  $('a[rel^="lightbox"]').fancybox({
        'fitToView'    : true,
        'arrows'        : true,
        'closeBtn'      : true,
        'closeClick'    : false,
        'nextClick'    : false,
        'loop'          : false,
        'nextEffect'    : 'fade',
        'prevEffect'    : 'fade',
        'nextSpeed'    : 'slow',
        'prevSpeed'    : 'slow',
        'groupAttr'    : 'data-lightbox',
        helpers        : {
            title  : {
                type : 'inside'
            },
            buttons : {},
            thumbs  : {
                width  : 120,
                height  : 80
            }
        }
    });
});
</script>

---

Zitat:

---

Zitat von x4all

Es werden beide Frameworks geladen

---

Ach so...
dann musst du den Aufruf auch im noConflict-Modus machen

Code:

---

jQuery(document).ready(function() {
  jQuery('a[rel^="lightbox"]').fancybox({...});
});

---

Hmm, ich hab das versucht, aber das war es auch nicht... Script sieht jetzt so aus:

Code:

---

<script type="text/javascript">
  jQuery(document).ready(function() {
  jQuery('a[rel^="lightbox"]').fancybox({
        'fitToView'    : true,
        'arrows'        : true,
        'closeBtn'      : true,
        'closeClick'    : false,
        'nextClick'    : false,
        'loop'          : false,
        'nextEffect'    : 'fade',
        'prevEffect'    : 'fade',
        'nextSpeed'    : 'slow',
        'prevSpeed'    : 'slow',
        'groupAttr'    : 'data-lightbox',
        helpers        : {
            title  : {
                type : 'inside'
            },
            buttons : {},
            thumbs  : {
                width  : 120,
                height  : 80
            }
        }
    });
});
</script>

---

Erstmal musst du sicherstellen, dass jquery core vor mootools core geladen wird.
Dann siehe diesen Thread: mootools und jquery mit contao 3

Falls du contao 2.x verwendest gilt dasselbe. Um alle Scripte mootools oder jquery Schnippsel muss das entsprechend herum.

Hast du irgend einen Ausgabe Fehler in der Konsole (Firebug oder sonstiges Entwickler Tool)?

Du verwendest Fancybox 2.1.x? Also von fancyapps.com?
Da musst du entsprechend auf die CSS Klassen und Attribute achten: http://fancyapps.com/fancybox/#examples
Die kannst du aber mit jquery aber auch Dynamisch dann hinzufügen. Siehe hier: http://api.jquery.com/addClass/

Ich hoffe du findest alles ;)

jquery_fancybox2 0.1.0 beta1 Build 4

Fehler im Firebug sind nicht drin, Contao 2.11.5.
Vielleicht hilft das ja weiter: http://mansorygmbh.alfahosting.org/home.html
Aber: Zum testen ist das nur auf home.html zugewiesen. Man kann das ganze mit dem Login-Link, unten im Menü bei "PRESS" testen.

Lieber Gruß

Ist noch jemand was dazu ein- oder aufgefallen?

Grüße

Hatte selbes Problem mit Contao 2.11.6 und fancybox_2 0.1.0 beta1.
Aus welchem Grund auch immer, weigert sich Contao JS oder CSS Dateien einzubinden, die im Template mit einer Versionsangabe im Dateinamen eingebunden werden.

Also funktioniert nicht:
$GLOBALS['TL_JAVASCRIPT']['jquery_fancybox2_thumbs'] = 'system/modules/jquery_fancybox2/html/fancybox2/source/helpers/jquery.fancybox-thumbs.js?v=2.0.5';

Lösung: das Fragezeichen und die Versionsbezeichnung weglassen, dann werden die CSS und JS Dateien korrekt eingebunden und alles funktioniert:
$GLOBALS['TL_JAVASCRIPT']['jquery_fancybox2_thumbs'] = 'system/modules/jquery_fancybox2/html/fancybox2/source/helpers/jquery.fancybox-thumbs.js';

Gruß,
Lukas

Mit htmlspecialchars() müsste eigentlich auch der Query String möglich sein.

nope, leider nicht.
vermutlich macht der querystring bei dem quell-js probleme beim generieren des temporären js-dateinamens, so ins blaue rein geraten.

der entwickler möge das doch bei der nächsten fancyboxversion berücksichtigen.. :)

lukas