Gallery mit mobiltauglichem Photoswipe

NaN · 12. Januar 2013 19:39

Kann es sein, dass der IE hier ein Problem mit dem "fehlenden" Base-Tag hat?
Bei Brandy kommt der Baser-Tag erst nach den Scripts.
Bei Klenkes kommt er schon davor.

Klenkes · 12. Januar 2013 21:05

Eher nicht.
Die Scripts vor dem Base-Tag sind nur vom Framework und nicht von Photoswipe.
Hatte ich aber auch schon in Verdacht.

brandy · 13. Januar 2013 02:03

Hab die Dateien jetzt neu aufgespielt - Handy, Firefox und Opera machen ihre Sache ganz gut - ein kurzer Test beim Netbook meiner Freundin mit IE8 fiel wieder negativ aus. Wenn es nicht funktioniert, oder die Dateien fehlerhaft sind, dürfte es ja nirgends funktionieren, oder?

Klenkes · 13. Januar 2013 10:27

Das ist alles echt seltsam...
Ich hab zur Zeit 3 Websites in der Warteschlange und es funktioniert bei allen runter zum zum IE7 problemlos.

Diese IE reagieren manchmal eigenartig auf die verschiedensten Sachen.

Hast du mal die htaccess deaktiviert?
Ich hatte mal ein IE-Problem mit gzip und deflate, kann mich aber durch "temporäre Überarbeitungsdemenz" nicht mehr erinnern, was genau es denn war.

Hast du die Seite LOKAL entwickelt?
Hat es dort funktioniert?

Vieleicht doch mal den Base-Tag,
sprich {metadata} vor die Foundation/Jquery Einbindungen setzen.

Binde doch testhalber mal meine Dateien ein:

Hier klicken, um den Code zum Kopieren zu markieren

<script type="text/javascript" src="http://elke25.kopfleere.de/js/klass.min.js"></script>
<script type="text/javascript" src="http://elke25.kopfleere.de/js/photoswipe.min.js"></script>

Das Ergebnis würde mich interessieren!

brandy · 13. Januar 2013 12:00

Gut mit deinen Dateien (jetzt noch eingebunden - http://www.floors.at/index.php?page=bilder) funktionierts.
Die Bilder werden bei mir noch nicht angzeigt, aber grundsätzlich lädt er mal Photoswipe!
Hast du die Dateien direkt von Photoswipe? Ich hab mir nämlich gestern nochmal alle runtergeladen und am Server ersetzt!

{metadata} hab ich jetzt auch mal vor die Foundation-Dateien gestellt.

Könnt ihr mal eines probieren: Lade die Gallery - also http://www.floors.at/index.php?page=bilder - in Firefox. Klickt nichts und wartet. Bei mir verabschiedet sich dann das Bild inkl. Leiste von Photoswipe. Bei Klick darauf, erscheint die Leiste zwar wieder, aber die Buttons sind nicht klickbar!

Klenkes · 13. Januar 2013 13:54

brandy schrieb:

Gut mit deinen Dateien (jetzt noch eingebunden - http://www.floors.at/index.php?page=bilder) funktionierts.
Die Bilder werden bei mir noch nicht angzeigt, aber grundsätzlich lädt er mal Photoswipe!
Hast du die Dateien direkt von Photoswipe? Ich hab mir nämlich gestern nochmal alle runtergeladen und am Server ersetzt!
{metadata} hab ich jetzt auch mal vor die Foundation-Dateien gestellt.

Stimmt. Photoswipe lädt ohne Fehler, aber es wird kein Bild angezeigt.
Meine Datein sind natürlich auch aus dem Photoswipepaket! Doch gibt es mind. 4 verschiedene.
2 x min-Dateien
mit je 1x mit jquery und ohne.
Ich muss morgen mal schauen, was genau der Unterschied ist.

brandy schrieb:

Könnt ihr mal eines probieren: Lade die Gallery - also http://www.floors.at/index.php?page=bilder - in Firefox. Klickt nichts und wartet. Bei mir verabschiedet sich dann das Bild inkl. Leiste von Photoswipe. Bei Klick darauf, erscheint die Leiste zwar wieder, aber die Buttons sind nicht klickbar!

Kann ich mit FF18 nicht nachvollziehen. Mit dem FF17 aber auch schon nicht.

brandy · 13. Januar 2013 14:13

Danke!
Schönes Wochenende noch!

Klenkes · 14. Januar 2013 09:35

Klenkes schrieb:

Meine Datein sind natürlich auch aus dem Photoswipepaket! Doch gibt es mind. 4 verschiedene.
2 x min-Dateien
mit je 1x mit jquery und ohne.
Ich muss morgen mal schauen, was genau der Unterschied ist.

Heute ist das morgen von gestern und ich hab geschaut big_smile

Diese Datei wäre aus dem Photoswipepaket die Richtige:
code.photoswipe.jquery-3.0.5.min.js
(Diese hatte ich der Einfachheit halber umbenannt)

Der Unterschied ist wohl, ob man jQuery einsetzt, oder nicht! Falls ja, muss die Datei mit dem .jquery- Zusatz verwendet werden.
Die Dokumentation ist da nicht besonders gesprächig, oder wenigstens nicht für mich.

Ich ändere dies in meinem Eingangspost.

brandy · 14. Januar 2013 19:01

Kannst du mir vielleicht den neuen Link von dir senden?
Bei mir lädt er nämlich noch immer keine Bilder - ich probiere mal deine Datei!

Klenkes · 14. Januar 2013 19:45

Welchen Link meinst du?

Hier klicken, um den Code zum Kopieren zu markieren

<script type="text/javascript" src="http://elke25.kopfleere.de/js/klass.min.js"></script>
<script type="text/javascript" src="http://elke25.kopfleere.de/js/photoswipe.min.js"></script>

Das ist echt verrückt!
Egal was ich versuche, ich kann dein Problem nicht nachstellen.

Beitrag geändert von Klenkes (14. Januar 2013 20:09)

brandy · 14. Januar 2013 20:38

Gut, funktioniert bei dir http://www.floors.at/index.php?page=bilder?
Wenns du mir ein "ja" gibst bin ich zufrieden...

Klenkes · 14. Januar 2013 20:41

Im IE8 werden einfach keine Bilder angezeigt!

Auf der Github Seite von Photoswipe taucht das Problem genau 1x als Problem auf. Leider jedoch keine Lösung dafür.

Hier

Beitrag geändert von Klenkes (14. Januar 2013 20:42)

Klenkes · 14. Januar 2013 20:57

So seltsam es klingen mag, aber ich glaube, dass die foundation.min.css dazwischen funkt! Dort wird das div für das Bild irgendwie auf width:0 height:0 gesetzt.

Nehme ich die foundation.min.css raus, funktioniert es!

Klenkes · 14. Januar 2013 21:28

Im foundation CSS steht dies:

Hier klicken, um den Code zum Kopieren zu markieren

img, object, embed { max-width: 100%; height: auto; }

Wenn du das img raus nimmst, funktioniert es einwandfrei:

Hier klicken, um den Code zum Kopieren zu markieren

object, embed { max-width: 100%; height: auto; }

Oder du nimst es im normalen CSS raus und setzt es wieder in die media queries rein. Kannst ja von screen klein bis riesig machen. Das versteht der IE8-Depp eh nicht.

In deinem Falle so:
Im Foundation CSS das img Tag mit deiner Klasse .logo ansprechen:
(Damit dein Logo funktioniert)

Hier klicken, um den Code zum Kopieren zu markieren

img.logo, object, embed { max-width: 100%; height: auto; }

Und am Ende der foundation.css einsetzen:

Hier klicken, um den Code zum Kopieren zu markieren

@media only screen and (min-width: 200px) and (max-width:4000px) {
img { max-width: 100%; height: auto; }
}

Damit gilt das max-width wieder für alle, die es auch verstehen.

Beitrag geändert von Klenkes (14. Januar 2013 21:49)

brandy · 15. Januar 2013 19:42

Gut - also bei dir funktionierts oder?

Klenkes · 15. Januar 2013 19:47

Ja. Zum Testen und Fehlersuche hatte ich deine Bilderseite lokal abgespeichert. Dort zeigte sie den Fehler mit dem fehlendem Bild beim IE6.
Die CSS Korrektur behebt den Fehler.

kampkrusty · 16. Januar 2013 08:56

Wirklich eine feine Sache. Funktioniert auch soweit. Besteht die Möglichkeit auf der Galerie Seite abzufragen ob es sich um ein mobiles Endgerät handelt und dann zwischen zwei Galerien zu entscheiden?

Andynium · 16. Januar 2013 11:25

http://www.cmsmadesimple.de/forum/viewt … 282#p22282

Die Abfrage im head eingefügt kannst du dies auswerten und die passenden Javascripte und Stylesheets laden.

brandy · 16. Januar 2013 19:01

@Klenkes: Die Seite online funktioniert im IE8 aber auch nicht, bei mir zumindest, vielleicht kannst du mal nachschauen - http://www.floors.at/index.php?page=bilder

Danke!

Klenkes · 16. Januar 2013 20:11

brandy schrieb:

@Klenkes: Die Seite online funktioniert im IE8 aber auch nicht, bei mir zumindest, vielleicht kannst du mal nachschauen - http://www.floors.at/index.php?page=bilder
Danke!

Sieht nicht so aus, als ob du meinen Fix(von oben) eingebaut hättest.
Bei minifizierten Dateien schwer festzustellen. Hab's aber nicht gefunden.

brandy · 17. Januar 2013 23:59

Ok danke... Tut mir leid Klenkes für deine für Mühe - aber wenn man die CSS bearbeitet, die nicht verlinkt ist, kann man lange warten, dass sich was tut*g* - auf jedenfall funktionierts jetzt!

kampkrusty · 15. Februar 2013 14:18

cyberman schrieb:

http://www.cmsmadesimple.de/forum/viewt … 282#p22282
Die Abfrage im head eingefügt kannst du dies auswerten und die passenden Javascripte und Stylesheets laden.

Kann man sich das irgendwo mal als Beispiel anschauen?

/edit
möchte im Prinzip nichts anderes machen als das photoswipe template anzuzeigen, falls es sich um ein mobiles Gerät handelt

/edit2
Im Moment löse ich das über verschiedene Templates und folgenden Eintrag im Head:

Hier klicken, um den Code zum Kopieren zu markieren

{if ($tbmobile->isMobile())}   
<meta http-equiv="refresh" content="5; URL=http://www.meine.url"> 
{/if}

Nicht gerade schön, funktioniert aber...

Beitrag geändert von kampkrusty (15. Februar 2013 15:04)

rage_all · 15. Februar 2013 15:33

Google mag die META-Redirects auch nicht so...
Google Webmaster Help

Google Webmaster Help schrieb:

This meta tag sends the user to a new URL after a certain amount of time, and is sometimes used as a simple form of redirection.
However, it is not supported by all browsers and can be confusing to the user. The W3C recommends that this tag not be used. We recommend using a server-side 301 redirect instead.

Um bei meiner letzten Seite jedem Gerät eine optimale Galerie bieten zu können, musste ich für jedes Album eine eigene Seite anlegen, statt einfach die Struktur von Gallery zu übernehmen - was halt komfortabler gewesen wäre, auch mit Vorschaubildern, usw.
Nun habe ich eben einzelne Inhaltsseiten und mit dem mobiledetector-Plugin eine Abfrage mit Einbettung der Fotogalerie auf der Seite mit entweder PrettyPhoto oder Swype:
Fotogalerien auf Mr. Onions

So sieht es im Template aus:

Hier klicken, um den Code zum Kopieren zu markieren

[== Smarty/HTML ==]

{if $rawdevicetype == "computer"}
   {Gallery template='OnionBox' dir='silvester-11'}
{elseif $rawdevicetype == "phone" || $rawdevicetype == "tablet"}
   {Gallery template='OnionsBoxMobile' dir='silvester-11'}
{/if}

Je nach Seitenstruktur kann es also auch überhaupt nicht unangenehm sein, das Fotogalerien-Template auf diese Art und Weise auszuwählen. Abgesehen davon kann mit dem Plugin noch mehr gemacht werden, z.B. eine Abfrage auf iOS. Das hab ich auf derselben Seite noch unter "Anfahrt" eingebaut: Wenn iOS, dann maps.apple.com <-> ansonsten ruft ein JavaScript via "geo:lat,lng?q=keyword" die im Endgerät vordefinierte Navigations/Kartenapp auf.

P.S.: Ich weiß, auf dem iPhone sieht es noch nicht so klasse aus, aber ich hab kein iPhone... Und solange das so bleibt oder bis ich mir mal eins über ein paar Tage hinweg ausleihen kann, wird das wohl so bleiben müssen...

Andynium · 15. Februar 2013 20:46

kampkrusty schrieb:

Im Moment löse ich das über verschiedene Templates und folgenden Eintrag im Head:
Hier klicken, um den Code zum Kopieren zu markieren
{if ($tbmobile->isMobile())}   
<meta http-equiv="refresh" content="5; URL=http://www.meine.url"> 
{/if}
Nicht gerade schön, funktioniert aber...

Alternativ wäre auch

Hier klicken, um den Code zum Kopieren zu markieren

{if ($tbmobile->isMobile())}   
{redirect_url to='http://www.meine.url'}
{/if}

möglich wink .

kampkrusty · 15. Februar 2013 20:57

Dauert das nicht auch recht lange? Also immer diese Gedenksekunde?
Halte das redirecten grundsätzlich für falsch bei dieser Problemstellung.
Wie müsste so eine Lösung denn sauber aussehen?

Forum für CMS/made simple

#26 12. Januar 2013 19:39

Re: Gallery mit mobiltauglichem Photoswipe

#27 12. Januar 2013 21:05

Re: Gallery mit mobiltauglichem Photoswipe

#28 13. Januar 2013 02:03

Re: Gallery mit mobiltauglichem Photoswipe

#29 13. Januar 2013 10:27

Re: Gallery mit mobiltauglichem Photoswipe

#30 13. Januar 2013 12:00

Re: Gallery mit mobiltauglichem Photoswipe

#31 13. Januar 2013 13:54

Re: Gallery mit mobiltauglichem Photoswipe

#32 13. Januar 2013 14:13

Re: Gallery mit mobiltauglichem Photoswipe

#33 14. Januar 2013 09:35

Re: Gallery mit mobiltauglichem Photoswipe

#34 14. Januar 2013 19:01

Re: Gallery mit mobiltauglichem Photoswipe

#35 14. Januar 2013 19:45

Re: Gallery mit mobiltauglichem Photoswipe

#36 14. Januar 2013 20:38

Re: Gallery mit mobiltauglichem Photoswipe

#37 14. Januar 2013 20:41

Re: Gallery mit mobiltauglichem Photoswipe

#38 14. Januar 2013 20:57

Re: Gallery mit mobiltauglichem Photoswipe

#39 14. Januar 2013 21:28

Re: Gallery mit mobiltauglichem Photoswipe

#40 15. Januar 2013 19:42

Re: Gallery mit mobiltauglichem Photoswipe

#41 15. Januar 2013 19:47

Re: Gallery mit mobiltauglichem Photoswipe

#42 16. Januar 2013 08:56

Re: Gallery mit mobiltauglichem Photoswipe

#43 16. Januar 2013 11:25

Re: Gallery mit mobiltauglichem Photoswipe

#44 16. Januar 2013 19:01

Re: Gallery mit mobiltauglichem Photoswipe

#45 16. Januar 2013 20:11

Re: Gallery mit mobiltauglichem Photoswipe

#46 17. Januar 2013 23:59

Re: Gallery mit mobiltauglichem Photoswipe

#47 15. Februar 2013 14:18

Re: Gallery mit mobiltauglichem Photoswipe

#48 15. Februar 2013 15:33

Re: Gallery mit mobiltauglichem Photoswipe

#49 15. Februar 2013 20:46

Re: Gallery mit mobiltauglichem Photoswipe

#50 15. Februar 2013 20:57

Re: Gallery mit mobiltauglichem Photoswipe

Fußzeile des Forums