annabr: slideshow öffnet sich im smartphone im Hochformat statt im Querformat

problematische Seite

https://www.siedlerverein-lohermoos.de/aktuelles.html Beim Klick auf den link: „Unser 1. Sommerfest – slideshow“

öffnet sich auf meinem smartphone die slideshow automatisch auf dem Hochformat-screen. Ich muss dann händisch das smartphone drehen, damit die slideshow im Querformat zu sehen ist. Die slideshow sollte beim Öffnen automatisch ins Querformat überwechseln.

Wie bitte kann ich Abhilfe schaffen? Ich kann (noch) kein javascript. Die slideshow konnte ich auf youtube mitschreiben. Lediglich die h1 habe ich selbst hinzugefügt sowie die Größe der pointer und Bilder fürs smartphone angepasst. Es wäre schön, wenn Sie mir einen Tipp geben könnten. Danke im voraus für Ihre Antwort und Gruss, annabr

  1. problematische Seite

    Hallo annabr,

    öffnet sich auf meinem smartphone die slideshow automatisch auf dem Hochformat-screen.

    Wenn Du das Phone im Hochformat hältst, ist das das zu erwartende Verhalten.

    Ich muss dann händisch das smartphone drehen, damit die slideshow im Querformat zu sehen ist.

    Das ist die dann zu erwartende Aktion

    Die slideshow sollte beim Öffnen automatisch ins Querformat überwechseln.

    Das wäre ziemlich unerwartet. Du müsstest dann den Kopf zur Seite drehen, um sie betrachten zu können. Abgesehen davon: An welcher kurzen Kante des Handys soll dann der linke Rand des Querformats sein? In 50% der Fälle wirst Du falsch raten.

    Meine Empfehlung: Nicht machen. Der User hat die Hoheit über die Darstellung, nicht deine Seite. Wenn jemand die Slideshow im Querformat betrachten will, wird sie oder er das Handy schon dafür drehen.

    Man kann mit CSS herumbasteln und prüfen, ob das Telefon im Hochformat ist.

    @media (orientation:portrait) {
       ... CSS Regeln um den Inhalt um 90° zu drehen
    }
    

    Du könntest für diesen Fall die Slideshow ausblenden und einen Text zeigen, der auffordert, die Seite im Querformat darzustellen.

    Ich prophezeihe Dir aber eine Flut von geräteabhängigen Quirks und Problemen. Zum Beispiel: Du öffnest die Seite auf einem Desktop-Browser und machst das Fenster schmaler als es hoch ist. Schwupps - es dreht sich. Oder verlangt nach Querformat. Und schwupps ist der User laut fluchend auf dem Weg zum Close-Button.

    Der gute (hihi) alte Internet Explorer hatte eine CSS @-Regel namens @viewport. Die hätte das ermöglicht:

    @viewport {
      orientation: landscape;
    }
    

    Aber sie ist mit dem IE gestorben. Nicht verwenden, auch wenn sie auf deinem Gerät funktionieren könnte! Aus den genannten Gründen: Erzwungenes Querformat ist nur auf mobilen Geräten sinnvoll und es gibt keine korrekte Möglichkeit, zu prüfen, ob Du auf einem mobilen Gerät unterwegs bist oder nicht.

    Mit <meta name="viewport" content="..."> ist die Bestellung einer konkreten Orientierung ebenfalls nicht möglich.

    Rolf

    --
    sumpsi - posui - obstruxi
    1. problematische Seite

      Hallo Rolf, danke für Ihre ausführliche Antwort. Jetzt bin ich beruhigt, dass von meiner Seite keine Verbesserung möglich ist. Herzl. Gruß, Anna

      1. problematische Seite

        keine Verbesserung möglich

        Wie Rolf das beschrieb warst Du viel mehr auf eine „Verschlechterung“ aus.