search

Jaspero / ClaritySecurity

Source code for Clarity Security
https://clarityssu.com
MIT License
0 stars 0 forks source link

Marquee Text Sliding #4

Open flauc opened 2 years ago

markotarnaj commented 2 years ago

@flauc top text should have: transform: translateX(calc(50vw - {tx}vw)) where {tx} is offset from bottom bottom text should have: transform: translateX(calc(-50vw + {bx}vw)) where {bx} is offset from bottom

Example behaviour:

  1. user scrolls from top of the page to bottom
  2. top element gets into view, its {tx} value is close to 0
  3. user continues scrolling down, {tx} value continues to increase
  4. once top text reaches top of the screen, its {tx} value is close to 100

Same thing is done for {bx}