Frage an die Kollegen (@Walter Lenk @Developer @ecomplus.dev @WinHelp GmbH @M. Zitzmann @ff-webdesigner & Co.) oder technisch versierte Shopbetreiber: Hat einer von Euch eine Lösung für das im Betreff genannte Problem (scrollTop 0 bei Öffnen des Slideout Warenkorbs)? Ich weiß, wie's geht, aber säße da paar Stunden dran. Da würde ich doch lieber einfach den Vermittler spielen Vielen Dank und frohe Ostern schon mal
Hey Dominik, das scrolltop da rauszunehmen ist noch das einfachste. In einem Custom-Theme einfach die JS komplett ersetzen (/javascripts/system/Global/scripts.min.js & /javascripts/system/Global/scripts.js) jeweils ohne Zeile window.scrollTo(0, 0); - nicht schön aber funktioniert. Das CSS muss aber dann ebenfalls etwas umfangreicher angepasst werden, weil der Off-Canvas Warenkorb mit der normalen Seite an sich mitscrollt und beim Öffnen dann unter Umständen nicht mehr sichtbar ist. (daher macht macht es auch Sinn warum Gambio hier erst nach oben scrollt, auch wenn das grauenvolle UX an sich ist) Ich habe vor kurzem für die Mobil-Kategorien das ganze als Off-Canvas umgesetzt und dabei das Problem schon gesehen. Ich hatte daher kurzerhand dort das ganze umgeschrieben. Den Warenkorb habe ich bisher noch nicht angefasst, steht aber noch auf meiner Liste für das gleiche Projekt. Wenn es bis nächste Woche Zeit hat, kann ich dir den Code dann schicken. Ebenfalls schöne Ostern
Hi André, super, danke Dir! Genau, die JavaScript-Anpassung war kein Problem und beim CSS habe ich dann nach einigen Versuchen entschieden, dass das zu wild wird. Selbstverständlich kommt es auf ein paar Tage nicht an... Vielen lieben Dank und auch Dir nochmal frohe Ostern!
Kann ich nachvollziehen - hat mich bei den Kategorien Stunden gekostet zu verstehen was da überhaupt passiert. Es ist ein Browser-Bug und das scrollto ist der Workaround Stand 2014 . Das Problem hängt mit dem transform: translateX auf dem Body-Tag zusammen. Dadurch verschiebt sich das Window und position fixed ist davon abhängig. Man hätte jetzt einfach transform: translateX auf #outer-wrapper setzen können und das Off-Canvas entsprechend außerhalb platzieren, aber darauf ist wohl keiner gekommen. Nachfolgender CSS-Code ist der einzige, der bei mir das Problem behebt: Code: body.show-cart { transform: none; } body.show-cart #outer-wrapper #header .inside, body.show-cart #outer-wrapper #categories, body.show-cart #outer-wrapper .slider-container-wrapper, body.show-cart #outer-wrapper #wrapper, body.show-cart #outer-wrapper #footer { transform: translateX(-300px); } body #outer-wrapper #header .inside, body #outer-wrapper #categories, body #outer-wrapper .slider-container-wrapper, body #outer-wrapper #wrapper, body #outer-wrapper #footer { transition: ease 300ms transform; } body.show-cart #offcanvas-cart-content { background: #fff; z-index: 2002; right: 0; }
@Dominik Späte entschuldige die fehlende Reaktion von mir. Hab leider keine Mail als Benachrichtigung bekommen und lese Dein Thema erst jetzt. Ich hätte bei uns leider nichts in der Schublade gehabt. Das hoch scrollen ist nicht toll. Aber darf ich nachfragen ob es einen speziellen Anlass gibt wo man das unbedingt unterbinden muss? Oder einfach eine normale Kundenanfrage? Viele Grüße Walter
Hallo @Walter Lenk Vielen herzlichen Dank! Auslöser meines Beitrags war eine Kundenanfrage. Nicht die erste zu dem Thema, weil's halt teilweise wirklich eine unterirdische Benutzererfahrung bietet. Stell Dir eine ewig lange Artikelliste mit Warenkorb-Buttons auf dem Smartphone vor. Du hast 30 Meter nach unten gescrollt, legst einen Artikel in den Warenkorb und kannst wieder von vorne anfangen zu scrollen, wenn Du Dir die weitere Artikel anschauen möchtest.
Guten Morgen Dominik, danke für die Rückmeldung. Ja, das ist natürlich irre. Mich wundert es dass uns eine Anfrage in die Richtung noch nie erreicht hat. Grüße Walter PS: Wieder keine Mail wegen der Erwähnung erhalten, scheint nicht zu funktionieren diese Benachrichtigung. Habs aber nun erhalten weil ich das Thema abonniert habe.