Hallo ins Forum,
ich bin auf der Suche nach einer Bildergalerie, die
1) mehrere Galerien auf einer Seite handeln kann
2) auf mobilen Endgeräten mit "Wischen" bedient werden kann
Ich bin auf YAG-Gallery gestoßen und habe mir deren Seite angeguckt, auch auf dem Smartphone. Mehrere Galereien sind kein Problem, aber bei allen Demobeispielen geht das Wischen nicht, ich sehe immer nur die Pfeile bzw. die Links für "Weiter" und "Zurück".
Kann man das einstellen oder funktioniert das grundsätzlich nicht bei YAG?
Danke für n Tipp und Gruß
mimii
Einfach ein jQuery Galerie-Plugin mit "Wisch-support" suchen und ein eigenes Theme für YAG erstellen.. dafür gibt es ja die Möglichkeit, eigene Themes zu erstellen.
Danke für den Tipp,
gibt es eine Empfehlung, die besonders gut mit YAG geht. Ich habe das Lightbox Theme eingebunden, das man doch sicherlich so abändern kann, dass swipe funktioniert? Man kann doch sicherlich auf dem bestehenden Theme aufbauen und diese Funktionalität nachrüsten?
Danke für n Tipp und Gruß
mimii
Hi nochmal ins Forum,
ich bin immer noch am suchen und probieren und *ach* klappt alles nicht.
Ich steh völlig auf dem Schlauch, wie ich der Lightbox "Wischeffekte" für Touchscreens beibringe.
Ich habe versucht auf Basis des "default Themes" Photoswipe (http://photoswipe.com/) einzubinden und nix geht. Das HTML hab ich angepasst, aber beim Klick auf ein Bild, wird nur das Bild im Browserfenster in Originalgröße eingebunden. Keine Lightbox und und von "Wischen" keine Spur.
Bin dankbar für jede Hilfe. Ach und... kosten darf es nix :-/
Gruß
mimii
Kein Link zur Seite,
keine Codeschnipsel,
und... kosten darf es nix :-/
Ja, Mensch, viel Glück dann auch 🙂
Ja danke,
das kann ich brauchen ;-). Eine Nacht mehr am Code und wenigstens läuft das Theme jetzt und die Galerie mit Lightbox und Swipeeffekt. Einziges Problem ist nun, dass es auf einer Seite mehrere Contentelemente mit der yag-gallery gibt.
<div class="tx-yag-pi1 theme-photoswipe">
<div id="yag-c12" class="yag-list-wrap yag-gallery" data-yag-gallery-settings="[]">
<ul>
<div class="tx-yag-items gallery-row">
<li><a...><img...>... </a></li>
<li><a...><img...>... </a></li>
<li><a...><img...>... </a></li>
</div>
</ul>
</div>
</div>
</div>
</div>
<div class="tx-yag-pi1 theme-photoswipe">
<div id="yag-c13" class="yag-list-wrap yag-gallery" data-yag-gallery-settings="[]">
<ul>
<div class="tx-yag-items gallery-row">
<li><a...><img...>... </a></li>
<li><a...><img...>... </a></li>
<li><a...><img...>... </a></li>
</div>
</ul>
</div>
</div>
Nun muss natrülich beim Klick auf ein Bild die variable ID z.B. id="yag-c12"ins jQuery übergeben werden, so dass immer nur ein Galerie durchlaufen wird.
$(document).ready(function(){
var myGallery = $("#yag-c12").each(function(){
$(this).find("a").photoSwipe();
});
});
In yag wird der code so erzeugt
<div id="yag-{config.contextIdentifier}" class="yag-list-wrap yag-gallery" data-yag-gallery-settings='{yag:Javascript.JsonSettings(tsPath:"javaScriptSettings")}'>
<ul>
....
</ul>
</div>
Vielleicht hilft ja neben etwas Glück auch ne Idee oder fundiertes Wissen, das ich grad nicht habe ^^
thx für Hilfe und Gruß
mimii
Ich werde mir jetzt nicht den Kram installieren und einrichten,
aber so in etwa könnte es laufen:
$(document).ready(function(){
var myGallery = $(".yag-list-wrap.yag-gallery").each(function(){
$(this).find("a").photoSwipe();
});
});
Wenn du halt mehrere Gallerien hast, mußt du andere Selektoren nutzen statt der id,
die Klassen "yag-list-wrap yag-gallery" bieten sich da ja an, da bei allen Gallerien identisch.
Hi nochmal,
danke für den Tipp. Die Photogallerie läuft, wenn ich auf ein Bild klicke. ABER nicht so wie sie soll. Egal in welche der 5 Gallerien auf meiner Seite ich klicke, es erscheinen immer nur die Bilder der letzen Gallerie (also der 5. Gallerie) auf der Seite. Und die werden korrekt durchlaufen.
Ich rufe es so auf, wie von dir oben beschrieben über die Klasse .yag-gallery
Verzweifelte Grüße
mimii
Dann würde ich es mal so versuchen:
$(document).ready(function(){
var myGallery_1 = $("#yag-c12").each(function(){
$(this).find("a").photoSwipe();
});
var myGallery_2 = $("#yag-c13").each(function(){
$(this).find("a").photoSwipe();
});
... usw. für jede weitere gallery-Id
});