iobroker.pro / .net Refreseh der Seiten bei Runter-Scrollen

[Mats Becker]

Hi Zusammen,

ich habe in VIS ein Design erstellt, dass bei meinem iPhone über die tatsächliche Höhe der Seite hinausgeht. Sprich man muss nach unten mit dem Finger im Browser scrollen.

In der lokalen Darstellung (lokales Netzwerk) im iOS Safari Browser, in der iOS App ioBroker und auch auf den Desktop Browser mit mobiler Ansicht (Developer Settings) funktioniert das Scrollen.
Bei den Web-Diensten iobroker.pro / .net habe ich allerdings das Problem, dass beim Nach-Unten Scrollen mit dem iOS Browser (egal ob Safari, Chrome, etc.) alle Views neu laden und ich von der aktivierten View zur Haupt-View zurückkehre.
Der Refresh ist kein Neu-Laden der Webseite sondern nur ein Javascript-seitiger Refresh aller Views.

Hat jmd. ein ähnliches Problem bei "längeren" seiten in der mobilen Ansicht? Weiß jmd. einen Tipp wie ich das beseitigen oder debuggen kann?

Danke Euch und schöne Grüße.

[Ben_Home]

Hallo Mats,
das ist so ein Zufall, dass ich mich jetzt hier angemeldet habe. Mit dem Thema habe ich mich am Wochenende vergnügt (rum geärgert) und hatte auch zeitweise dein Phänomen.
Ich weiß nicht, ob meine Lösung "sauber" ist, aber bisher scheint sie zu funktionieren.

Wie hast du das Problem gelöst, dass auf dem iphone der Hintergrund beim Scrollen außerhalb des Bereichs der eigentlichen Auflösung weiß wird?
Ich hatte dazu die Auflösung auf HD gestellt um einen möglichst großen Hintergrund zu bekommen. Und da scheint das Problem zu sein.

Meine Lösung:
Im CSS (beliebige Größe eingeben):

#vis_container{
    width: 1000px !important; 
    height: 1500px !important; 
    
}

und in der VIS: Tools --> Auflösung "nicht definiert" für alles View's.

Besser?

Gruß
Ben

[Mats Becker]

Hi Ben,

zu deiner Frage: Wie bleibt der Hintergrund in der gleichen Frabe?

Ich habe relativ simpel dem "body"-Element per CSS die Hintegrundfarbe meiner Views zugewiesen:

body {
    background: #181820!important;
}

Die Auflösungen finde ich etwas verwirrend. Zumal mir bspw. auf dem iPhone 7 im Safari Browser beim lokalen und remote Zugriff + in der iOS App unterschiedliche Auflösungen angezeigt werden (+ Chrome Developer Tools hat auch noch eine unterschiedliche Auflösung).

Die Idee mit "manuellen" Zuweisung der Höhe eines Views-Containers per CSS ist natürlich smart. Ich habe eine Tabbar am Fuß der Seite mit der Positionierung "position: absolute; bottom: 0px;"; deshalb funktioniert deine CSS-Anweisung nicht ganz. Mit der folgenden Anweisung sieht es ganz gut aus:

#vis_container > div {
    /* width: 1000px !important; */
    height: 1500px !important; 
    
}

Mit einem kleinen Script kann man das sicherlich noch dynamisch machen.

Ich werde es mal beobachten und berichten. Allerdings hatte ich auf dieser einen Scroll-Seite schon manuell einen HTML-Kasten zur Erweiterung der Länge hinzugefügt; also eigentlich das gleiche Resultat "verursacht". Ich hoffe es hilft dennoch!

Danke dir und schöne Grüße
Mats

[Mats Becker]

Hi Ben,

wie vermutet löst die manuelle Höhenangabe per CSS nicht das Problem; ich hatte schon vorher in der View einen "HTML Container" per Vis Editor mit Höhenangabe hinzugefügt, damit ich "scrollen kann".

Ich habe das Scroll-Verhalten mal in einem Screen-Recording festgehalten:

• Online via stremable.com: https://streamable.com/cx935
• Datei Upload hier im Forum: iobrokerpro.mp4

Auf dem ersten View "Power" funktioniert das Scrollen. Auf der zweiten View funktioniert es nicht korrekt und die View springt zur ersten.

Noch jmd. eine Idee was ich mal probieren kann?

Die in dem Video erkennbare Tabbar am unteren Ende der Seite ist von mir erstellt und wechselt per Klick auf einen Tab die Seite per Javascript. Ich prüfe derzeit noch, dass nicht bei einem Scroll "ausversehen" ein Klick in meinem Skript ausgeführt wird.

Danke und schöne Grüße
Mats

[Mats Becker]

Hi,

kurzes Feedback:

Das Neu-Laden der Seite beim Runter-Scrollen ist verschwunden, nachdem ich im iOS Safari entweder in den Inkognito-Modus wechsel oder aber alle Safar Daten (Caches) in den Einstellungen lösche. Das bedeutet, dass der iOS Safari beim Neu-Laden der Seiten von iobroker.pro / .net die Seite "wirklich" neu lädt und die letzte Version angezeigt wird.
Bei den neusten Versionen meiner Vis-Views ist ds Problem nicht mehr vorhanden und daher leider nicht mehr für mich reproduzierbar.

Das Scrollen sieht nun folgendermaßen aus: https://streamable.com/2ttg9

Für mich ist dann interessant wie kann ich beim mobilen Zugriff mit iOS Safari der seiten iobroker.pro / .net einen "wirklichen" Refresh erzwingen?
Ein Neustart des Adapter iot hilft nicht immer weiter. Für mich ist bisher nur der Weg über den Inkognito-Modus erfolgreich.

Hat jmd. vlt. Tipps wie ich eine Refresh bei iobroker.pro erzwingen kann?

Danke euch!