Scrollverhalten der CV bei unterschiedlichen Endgeräten...

[netsrac]

Moin Jungs,

ich versuche im Moment das Scrollverhalten der CV zu verstehen. Hintergrund ist, dass ein TopNavbar auf einem iPhone mitscrolled (was auch gut so ist), auf dem Desktop aber stehen bleibt. Leider scrolled es auch beim einem Nexus Tablet mit, während es auf einem iPad stehen bleibt.

Worüber wird das gesteuert. In der Templateengine gibt es eine "max_mobile_screen_width" - das alleine scheint aber nicht dafür zuständig zu sein.

Ich habe versucht, auf dem Desktop mit diversen Browsern das Verhalten auf einem Mobile Device (also NavBar scrolled mit weg) zu simulieren - aber ich schaffe es nicht. Weder Änderungen an der Bildschirmauflösung, noch an dem UserAgent bringen mich hier weiter.

Würde halt sehr gerne verstehen, wie das funktioniert....um dann das Verhalten auf dem Nexus 7 entsprechend anpassen zu können.


Danke...Netsrac

[MicHau]

Ist das nicht in templateengine.js Zeile 221 ff. zu finden?

[netsrac]

Ist das nicht in templateengine.js Zeile 221 ff. zu finden?

Recht hast Du....kommentiere ich hier "Android" aus, so funktioniert es, wie es sollte.

Stellt sich die Frage, wie man das hier geschickt löst. Ich denke man sollte hier nicht pauschal nach Endgeräten gehen (gerade bei Android macht das ja gar keinen Sinn), sondern auch noch die Bildschirmgröße mit betrachten...

...oder was denkt Ihr?!

Gruß, Netsrac

[netsrac]

Stellt sich die Frage, wie man das hier geschickt löst. Ich denke man sollte hier nicht pauschal nach Endgeräten gehen (gerade bei Android macht das ja gar keinen Sinn), sondern auch noch die Bildschirmgröße mit betrachten...

Habe mal geschaut und je nach Browser wird entweder direkt "Nexus 7" oder "Tablet" mit in den UA gesetzt. Habe daraufhin bei mir die Abfrage mal entsprechend erweitert:

  var mobileDevice = (/(android|blackberry|iphone|ipod|series60|symbian|windows ce|palm)/i.test(uagent));
  if (/(nexus 7|tablet)/i.test(uagent)) mobileDevice = false;  // Nexus 7 and Android Tablets have a "big" screen, so prevent Navbar from scrolling
  if (mobileDevice) {

Spricht da etwas dagegen....bei mir klappt's....

Wenn es keine besseren Ideen gibt, dann würde ich das ins SVN schreiben...


Gruß, Netsrac

[netzkind]

Spricht da etwas dagegen....bei mir klappt's....

Möglicherweise.
Der Grund für dieses Verhalten ist, dass sowohl Android als auch iOS zum Zeitpunkt der ersten CV-Entwicklung nix mit "overflow: auto;" oder "overflow: scroll;" anfangen konnten. Das wurde automatisch zu einem overflow: hidden.

Bei iOS wurde das mit Version 5 wohl behoben, bei Android scheint es ab Version 4 unterstützt zu sein. Beide Werte hab ich spontan aus dem Kopf abgerufen, kann mich also bei der genauen Versionsnummer verhauen haben.

Alles was älter ist als das KANN kein scrolling innerhalb von Elementen.
Den Fix selbst finde ich weiters relativ unflexibel, da es nicht nur das Nexus 7 gibt

Vorschlag:
rausfinden, welche iOS/Android-Versionen angefangen haben, overflow: scroll/auto zu unterstützen, und exakt auf diese testen. Beide haben die OS-Version im User-Agent.

Grüße,
Julian

[vlamers]

Ich habe den Browser auf "Desktop Version anfordern" gestellt... das merkt er sich.
Order einfach den UA am Gerät auf Desktop setzen (dauerhaft für alle Seiten [ about:config ])
Funktioniert seit mehreren Jahren bei mir mit unterschiedlichsten Android Versionen (2.3 bis 4.1.x). So bleibt die CV flexibel für mehrere Geräte

Gruß

Gesendet von meinem LG-P880 mit Tapatalk 2

[Robert_Mini]

Ich hab da auch noch ein Problem mit dem Scrollen unter FF in Android 4.03.

Design Metal, TopNavbar und Navnar Links.
Funktioniert, bis auf folgendes Verhalten bei Visuseiten, in denen mehr Widgets vorkommen, als auf einer Seite dargestellt werden können.

Scrollt man mit den Finger im Bereich Navbar links, so scollt Navbar links + Visuseite => OK

Scrollt man mit dem Finger im Visubereich, so scrollt zuerst die Visuseit um ca. 1/2 Zeile, und bewegt sich dann nicht mehr weiter => durch erneutes Aufsetzen des Fingers kann weitergescrollt werden (Navbar links scrollt dann mit).

Dies ist einerseits nervig, da man immer 2x scrollen muss, zusätzlich tritt bei meinem Toshiba AT-270 dann ein Darstellungsfehler auf (ein Teil des Bildinhalts wird schräg nach oben versetzt ein zweites Mal dargestellt) => inakzeptabel. Das liegt vermutlich an der Grafikkarte o.ä. da ich dies auch auf einer Internetseite mal erlebt habe, aber bei der CV leider immer so....

Kann man das getrennte Scrollen von Navbar links und Visuseite abstellen?
Das würde vermutlich das Tablet retten, sonst geht es wahrscheinlich zurück, da ich nicht drauf wetten möchte, ob sich das Problem mit Andoid 4.1 löst, falls das Update auch tatsächlich nach Ö kommt.

lg
Robert

[netsrac]

Das mit dem 2x scrollen hatte ich beim Nexus auch...

[Robert_Mini]

Das mit dem 2x scrollen hatte ich beim Nexus auch...

Hatte?
Was hast du jetzt in Verwendung wenn ich fragen darf?

lg
Robert

[netsrac]

Ich habe eine Codeänderung vorgenommen, die nur auf das Nexus 7 ausgelegt ist.

Diese Änderung gefällt zwar einigen hier nicht so ganz....aber es ist im Moment auch eine Abfrage im Ycode, die IPhone, IPod....und Android im allgemeinen das Scrollverhalten für (kleine) mobile Endgeräte zuweist.

Ich denke diese gesamt Codepassage ist nicht so geschickt gelöst, wenn man hier in Abhängigkeit vom UserAgent Entscheidungen trifft...

Just my 2 Cents...

Netsrac

[Merlin123]

Krieg man auf nem Android Tablett/handy hin das Layout wie im Screenshot hinzubekommen?
Er macht die einzelnen Boxen nicht nebeneinander, sondern untereinander.
Hab auch mal versucht das Android in der templateengine auszukommentieren oder auch einfach die Desktop Version anzufordern. Aber das sieht trotzdem nicht so toll aus
Hat jemand einen Vorschlag?
Der erste Screenshot ist auf dem Rechner, der 2. Handy mit Handyversion (ohne geänderte templateengine). Wenn ich auf dem Handy die Desktopversion anfordere kann ich dort nicht scrollen

Die Auflösung sollte nicht das Problem sein. Mein S3 hat 1280x720 Pixel, mein Desktop 1600x900, da ist ja aber noch Platz.

[peuter]

Mal so grob aus der Hüfte geschossen, wie siehts denn aus, wenn Du die Zeile mit Pages so machst:

<pages xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" design="metal" xsi:noNamespaceSchemaLocation="./visu_config.xsd" enable_column_adjustment="false">

[Merlin123]

Mal so grob aus der Hüfte geschossen, wie siehts denn aus, wenn Du die Zeile mit Pages so machst:

<pages xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" design="metal" xsi:noNamespaceSchemaLocation="./visu_config.xsd" enable_column_adjustment="false">

Ändert leider nichts.
Naja.. Wenn ich auf dem Handy die Desktopversion anfordere sind zwar die Spalten nebeneinander, aber die Icons und die Schrift der Schalter passen nicht mehr. Aber da ich da dann eh nicht scrollen kann ist das eh egal, weil ein großteil fehlt.

[Merlin123]

Wie zwinge ich CV denn dazu, alle Geräte als Mobile Device zu betrachten? Dann könnte ich mal auf dem Desktop schauen was passiert.
Ich dacht, wenn ich Zeile 213 so ändere
if (true) {
würde er das machen. Aber auf dem Desktop ändert sich die Anzeige nicht. Denkfehler oder hat der trotzdem die mobile Version geliefert? Sehe ich das irgendwie?

[merkelnando]

Unterschiedliches Scrollen bei verschiedenen Browsern

Hallo,

ich hänge es mal hier mit ran.

Zunächst einmal vielen Dank für die tolle Arbeit die hier leistet. Leider fehlen mir die Kentnisse um etwas Produktives beisteuern zu können.

Hier mein Problem:

Ich habe begonnen meine Visu (metal) von einer SVN-Version (ich schätze von 11/2012) auf die aktuelle 0.8.0~pre1 umzustellen.

Dabei ist mir aufgefallen, dass bei meinen Android Geräten (HTC Desire und Galaxy Tab 2) bei Verwendung von Opera Mobile (12.10) kein Scrollen möglich ist. Beim Touch auf die Inhalte, wird die Seite ohne die Navbar links komplett markiert. Mehr geht nicht, Auch wenn ich den UA von Opera auf Desktop umstelle, ändert sich nichts.

Bei Verwendung des beim Galaxy Tab2 mitgelieferten Browser (Android 4.0.3), funktioniert zwar das Scrollen, allerdings scrollt hier die ganze Seite inkl. der Navbar. Dabei scrollt die Inhaltsseite zunächst ein winziges Stück nach oben und dann kommt die Navbar mit.

Das selbe Verhalten zeigt auch die "metal"-Demo Konfiguration im Opera. Die anderen Demovarianten funktionieren bzgl. des Scrollverhaltens auf den genannten Geräten.

Auf meinem Notebook funktioniert es bei Opera problemlos.

Ist das ein Bug, oder muss ich etwas an meiner Konfiguration ändern.

Schönen Abend Euch.

Eiko