@@Rolf B

@Gunnar Bittersmann: hidden ist deine Idee

Hm, ich brachte hidden ins Spiel als Ersatz für das direkte Rumhantieren mit style.display = "none" – ohne letzteres erstmal zu hinterfragen. Das soll jetzt nachgeholt werden.

welche Vorschläge hast Du für die Lösung des Timings? Schaffe ich hier üble Workarounds für ein eigentlich ganz anders gelagertes Problem?

Scheint mir so, ja. Warum etwas verstecken, was sich sowieso schon außerhalb des Viewports befindet?

Abhängig vom Zustand des Steuerbuttons bekommen Esel und Menü translate: var(--panel-width) 0 verpasst (wobei die 0 für die y-Richtung auch weggelassen werden kann). Und translate lässt sich wunderbar animieren – und das auch performant.

Im Gegensatz zu margin-right – das zu animieren ist falsch (s.a. dieses Posting).

Wenn das Reinschieben nicht vom Viewportrand erfolgen soll, ist da noch ein overflow: hidden fällig, aber das bekommt man hin, ☞ guckst du.

Note: Das einzige, was JavaScript tut, ist den Zustand des jeweiligen Buttons zu ändern.

Jolan tru