Pernahkah Anda mengunjungi halaman web, mulai membaca beberapa konten, lalu halaman tersebut muncul karena iklan atau gambar dimuat, sehingga Anda kehilangan posisi di halaman?
Sebaiknya periksa tanda Scroll Anchoring di Chrome 51.
Pemasangan Achor Scroll melacak posisi Anda di halaman dan mencegah apa pun yang menyebabkan reflow mengganggu posisi Anda di halaman.
Untuk mencoba fitur ini, lakukan hal berikut:
- Buka chrome://flags/#enable-scroll-anchoring di Chrome Dev / Canary
- Pilih “Diaktifkan” dari menu dropdown
- Klik “Luncurkan Ulang Sekarang” di bagian bawah layar
Dengan ini, Anda akan mengaktifkan anchor scroll.
Kami telah menggunakannya selama beberapa waktu dan yakin bahwa hal ini akan sangat meningkatkan pengalaman bagi semua pengguna di web, tetapi kami ingin memastikan bahwa fitur ini berfungsi dengan baik di mana saja. Jika Anda menemukan contoh saat anchor scroll gagal menangani reflow di halaman atau contoh saat anchor scroll tidak seharusnya melakukan intervensi, kami sangat ingin mendengarnya.
Kirimkan masukan / contoh saat Anda melihat perilaku yang tidak terduga dengan mengisi formulir ini: g.co/reportbadreflow
FAQ
Bagaimana pengaruh perubahan ini terhadap scroll JavaScript?
Singkatnya, tidak.
Perubahan ini mengubah efek scroll yang disebabkan oleh reflow. Misalnya, menambahkan nama class ke elemen yang menyebabkannya bertambah tinggi akan menyebabkan reflow dan anchor scroll akan mencegah halaman berpindah-pindah.
Memanggil window.scrollTo(0, 1) (Ya, hack lama) tidak akan menyebabkan reflow
dan akan berperilaku normal. Hal yang sama berlaku untuk peristiwa sentuh.
Jika Anda menemukan contoh saat anchor scroll memengaruhi halaman Anda, kirimkan masukan melalui formulir ini: g.co/reportbadreflow