OP_SWIPER on small devices
Moderator: Tata
OP_SWIPER on small devices
The swiper doesn't show up on a device with e.g. smaller width than 300px. Why about? How to?
CMSimple.sk
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
Re: OP_SWIPER on small devices
So far, I have not been able to determine this in any case.
Do you have an online example at hand?
Re: OP_SWIPER on small devices
http://cmsimple.sk/ninthspace2/?Projects
On iPhone6. Eigentlich der Swiper läuft, nur die Bilder sind unsichtbar.
On iPhone6. Eigentlich der Swiper läuft, nur die Bilder sind unsichtbar.
You do not have the required permissions to view the files attached to this post.
CMSimple.sk
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
Re: OP_SWIPER on small devices
Ja, verstehe. Das ist ein Safari-Problem in älteren iOS-Versionen, wobei webp-Bilder nicht dargestellt werden können.
https://caniuse.com/webp
Mögliche Hilfe:
webp UND jpg auf dem Server hinterlegen und ein Pictur-Element mit Source-Set für die Bilder setzen.
Ungefähr so, wie hier empfohlen:
https://css-tricks.com/webp-image-suppo ... to-ios-14/
Wie man das allerdings bei dem Swiper realisieren kann, ist mir momentan nicht klar.
Olaf?
https://caniuse.com/webp
Mögliche Hilfe:
webp UND jpg auf dem Server hinterlegen und ein Pictur-Element mit Source-Set für die Bilder setzen.
Ungefähr so, wie hier empfohlen:
https://css-tricks.com/webp-image-suppo ... to-ios-14/
Wie man das allerdings bei dem Swiper realisieren kann, ist mir momentan nicht klar.
Olaf?
Re: OP_SWIPER on small devices
Der Screenshot ist vom FF, nicht von Safari . Und ich habe alle Bilder in JPG und auch WEBP hochgeladen. Aber den Tip versuche ich jedenfalls. Obwohl, die Bilder sind in content.htm plaziert und ich kann mir nur kaum vorstellen, alle einzelne Bilder mit dem Snippet reinzugeben, besonders mit dem Editor. Das würde veralngen, jedes Bild im Code reinzugeben. Oder eine Funktion in userfuncs.php zu schreiben? Das wäre aber wohl nur mit JS möglich, oder?
Code: Select all
<picture>
<source srcset="img/cat.webp" type="image/webp">
<source srcset="img/cat.jpg" type="image/jpeg">
<img src="img/cat.jpg" alt="Alt Text!">
</picture>
CMSimple.sk
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
Re: OP_SWIPER on small devices
Ja, das hängt auch mit dem Betriebssystem zusammen. Erst ab macOS 11 Big Sur wird webp unterstützt.
Re: OP_SWIPER on small devices
Dann sollte es wohl direkt im Swiper irgendwie eingestellt sein (wie es mit Videos eingestellt ist), dass - falls sich beide Formate im Ordner befinden - nimmt der Plugin den besten Format selbst. Naja, wie soll aber der Plugin wissen, was der User nutzt zum Browsen.
CMSimple.sk
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
Re: OP_SWIPER on small devices
Na ja, das ist im Swiper schwer bzw. gar nicht zu realisieren, weil die Bilder als Background-Images im Stylesheet definiert sind.Tata wrote: ↑Fri Oct 22, 2021 5:44 amObwohl, die Bilder sind in content.htm plaziert und ich kann mir nur kaum vorstellen, alle einzelne Bilder mit dem Snippetreinzugeben, besonders mit dem Editor. Das würde veralngen, jedes Bild im Code reinzugeben. Oder eine Funktion in userfuncs.php zu schreiben? Das wäre aber wohl nur mit JS möglich, oder?Code: Select all
<picture> <source srcset="img/cat.webp" type="image/webp"> <source srcset="img/cat.jpg" type="image/jpeg"> <img src="img/cat.jpg" alt="Alt Text!"> </picture>
Ich habe momentan keine Idee, wie man das lösen könnte. Da hilft eigentlich nur, JPG zu verwenden.
Re: OP_SWIPER on small devices
Das ist nur eine Sache. Die andere ist, die Höhe des Swiper. Die kann ich nicht responsive einstellen. Auf schmallerem Bildschim blelibt eine Lücke unter dem Bild. Der Bild selbst ist responsive.
Übrigens, ich baue jetzt die stylesheet.css komplett um.
Übrigens, ich baue jetzt die stylesheet.css komplett um.
Das wird nicht schwer umzuschreiben - alle webp zu jpg.Ich habe momentan keine Idee, wie man das lösen könnte. Da hilft eigentlich nur, JPG zu verwenden.
CMSimple.sk
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
Re: OP_SWIPER on small devices
Ja, das läuft mit JPGs. Schade nur, dass die Bilder jetzt viel größer sind. Einige sogar bis 500kB. Obwohl ich sie zu 1600px reduziert habe. Im original waren sie 2400px. Damit ist aber auch die Qualität ziemlich gefallen.
CMSimple.sk
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.