Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen der Seite angezeigt.

--- typo3:sk_fancybox [2014/08/26 22:15] – [FancyBox im News System (news)] admin
+++ typo3:sk_fancybox [2014/09/26 21:27] (aktuell) – [FancyBox im Shop System (tt_products)] admin
@@ Zeile 45: / Zeile 45: @@
       [...]
 </code>
+----
+===== FancyBox im Shop System (tt_products) =====
+Grundsätzlich kein Problem, außer es werden Inhalte dynamisch mit AJAX nachgeladen, wie es bei Artikelfotos von Varianten der Fall ist. Nach dem Wechsel einer Variante öffnet sich das neue Bild nicht mit der Fancybox.
+**Lösung:**
+  - jQuery 1.7.x verwenden
+  - TypoScript: ''ATagParams'' anpassen
+  - Ergänzendes JavaScript einbinden
+**TypoScript:**
+<code typoscript>
+plugin.tt_products.image.imageLinkWrap = 1
+plugin.tt_products.image.imageLinkWrap {
+  enable = 1
+  typolink {
+    parameter.override.cObject = IMG_RESOURCE
+    parameter.override.cObject {
+      file.import.data = TSFE:lastImageInfo|origFile
+      file.maxH = 850
+      file.maxW = 650
+    }
+    # tabindex="1" ist wichtig für Chrome!
+    ATagParams = tabindex="1" class="ajaxFancyBox" rel="fancybox"
+  }
+}
+</code>
+**Javascript:**
+<code javascript>
+$(".container").on("focusin", function(){
+ $("a.ajaxFancyBox").fancybox({
+  // fancybox API options here
+  'padding': 0
+ }); // fancybox
+}); // on
+</code>
+Quelle: [[http://stackoverflow.com/questions/9081571/how-to-bind-fancybox-to-dynamic-added-element/9084293#9084293|stackoverflow.com]]

Snippets + Wiki