Pengembangan Scroll Bar Buddy yang turun mengikuti halaman saat di-scroll

 (focusfurnace.com)
1 poin oleh GN⁺ 2025-03-04 | 1 komentar | Bagikan ke WhatsApp

  • Perkenalan Scroll Buddy

    • Ini adalah proyek yang menambahkan figur stik animasi untuk membuat scroll bar lebih menyenangkan
    • Saat melakukan scroll, Anda dapat melihat figur stik bergerak naik turun di samping halaman
    • Ke depannya direncanakan berbagai versi seperti skateboarder, pemanjat tebing, tupai, dan lainnya

  • Hal yang perlu diperhatikan

    • Contoh animasi yang disertakan di sisi halaman dapat menimbulkan masalah bagi sebagian pembaca
    • Pembaca dengan gangguan vestibular disarankan mengaktifkan fitur pengurangan gerakan di perangkat sebelum melihat animasi
    • Jika pengaturan pengurangan gerakan diaktifkan, Scroll Buddy akan disembunyikan di sebagian besar browser

  • Informasi lain

    • Proyek ini dibuat dengan JavaScript sederhana
    • Mereka juga menerima usulan ide untuk membuat scroll bar menjadi lebih menarik

  • Konten lain

    • Sisa teks adalah teks dummy untuk keperluan scroll dan tidak terkait dengan isi sebenarnya

Bacaan terkait

1 komentar

 
GN⁺ 2025-03-04
Komentar Hacker News
  • Menarik. Ada ide yang belum saya koding. Pada dasarnya seekor hamster dengan parasut perlahan jatuh ke bagian bawah halaman
    • Jika menggulir dengan cepat, parasutnya terbuka dan ia mendarat lagi di bagian bawah viewport
    • Saat diarahkan dengan mouse, ia mengangkat papan bertuliskan "Top" dan jika diklik akan terbang dengan jetpack; ketika layar mencapai bagian paling atas, ia membuka parasut lagi dan mendarat mulus di bagian bawah layar
  • Heran kenapa tidak ada yang menyebut ini 'Stroll Bar'
  • Fitur seperti ini harus dinonaktifkan saat pengguna mengaktifkan pengaturan prefers-reduced-motion
    • Diperlukan aturan CSS tambahan
    • @media (prefers-reduced-motion) { #scrollBuddy { visibility: hidden; } }
  • Dibanding scrollbar yang membosankan, rasanya akan lebih seru jika ada figur stik animasi yang berjalan naik turun di sisi halaman
    • Saya sudah membuat prototipe pertama
    • Selanjutnya saya berencana membuat pemain skateboard, pemanjat tebing, dan tupai
    • Penasaran teman scroll lain apa yang sebaiknya dibuat
  • Heran kenapa implementasinya disembunyikan di balik Google Form
    • Detail implementasinya mudah diakses dari DOM
    • Saya membagikan gist yang bisa mengekstrak detail terkait tanpa perlu memberikan email
  • Penasaran kenapa harus di balik Google Form. Bahkan tidak ada screenshot seperti apa tampilannya sebelum mengumpulkan alamat email. Postingan aneh bisa naik ke halaman utama
  • Ini mengingatkan pada akhir 90-an ketika orang menambahkan efek mata atau api yang mengikuti mouse ke situs web mereka
  • Saya tidak tahu apa yang saya lewatkan. Di Firefox dan Chrome saya tidak melihat apa pun selain scrollbar itu sendiri. Mungkin ada kaitannya dengan warna scrollbar kustom
  • Proyek seperti ini mengingatkan pada internet lama. Saya suka
  • Ini menekankan betapa tidak berguna dan sulit dipakainya scrollbar yang ada sekarang
    • Saya suka fitur yang memudahkan melihat posisi kita di halaman. Ada humornya juga. Saya suka