Impressum

Web-Experimente

Diagonales Scrollen

Bei diesem Web-Experiment wird der Inhaltsbereich per CSS mit transform: rotate(deg) gedreht, wobei Ausgangspunkt der Rotation die linke obere Ecke ist (transform-origin: 0 0). Beim Scrollen wird der Inhaltsbereich auf Basis einer trigono­me­trischen Berechnung auf der X-Achse mittels JavaScript verschoben, sodass der Inhaltsbereich nicht von unten nach oben, sondern diagonal durch den Bildschirm zu scrollen scheint. Die Formel für den Versatz lautet:
offsetX = scrollY * sin(deg * π / 180) Demoseite