Skill Maps

Scroll Magic

The background-attachment property determines if image is " stuck " to block or to browser window.

  • scroll (standard): background scrolls with the page.
  • fixed: background stays in place while content slides past. This creates simplest parallax effect.
Caution

background-attachment: fixed causes serious performance issues (repainting) on mobile devices. Many browsers on iOS/Android simply ignore this property to save battery.

Tip

For smoother and more reliable parallax, today use JavaScript or modern CSS scroll animations.