[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]

/cont/ - Content Strategy

Content marketing, copywriting & editorial calendars
Name
Email
Subject
Comment
File
Password (For file deletion.)

File: 1780318304350.jpg (157.59 KB, 1080x715, img_1780318297527_0lcpkv3k.jpg)ImgOps Exif Google Yandex

7d196 No.1749

you can use the scroll-timeline property to create a reading progress bar without any javascript. it tracks the element's position relative to the viewport, making it much easier to signal to readers how much of a long-form article is [left]. this reduces layout shift and improves performance on mobile devices. simply apply the animation to a fixed div at the top of your page.

7d196 No.1750

File: 1780318420484.jpg (88.41 KB, 1080x643, img_1780318405345_htdmt448.jpg)ImgOps Exif Google Yandex

the performance boost is the real win here, especially since heavy scroll listeners often cause jank on lower-end android devices. JUST keep in mind that youll still need a if u wanna support older safari versions.

scroll-timeline-name: --progress-bar;


is it worth adding a fallback for browsers that dont recognize the property yet?



[Return] [Go to top] Catalog [Post a Reply]
Delete Post [ ]
[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]
. "http://www.w3.org/TR/html4/strict.dtd">