CSS : Cara Menghilangkan Scrollbar di Browser

Cara Menghilangkan Scrollbar di Browser – Ada banyak waktu ketika kita perlu menyembunyikan scrollbar dari elemen HTML. Penggunaan dapat bervariasi dari orang ke orang. Ini adalah topik yang diperdebatkan untuk menjaga scrollbar atau tidak berdasarkan Interaksi Pengguna (UI)/Pengguna, Pengalaman (UX).

Sebagian besar waktu, saya tidak suka menampilkan bilah gulir kepada pengguna karena praktik desain yang saya ikuti.

Untuk mencapai ini, Anda hanya perlu menggelitik CSS untuk menambahkan beberapa penyeleksi semu untuk menyembunyikannya berdasarkan gaya Browser

Untuk Chrome:

/* Hide scrollbar for Chrome, Safari and Opera */::-webkit-scrollbar {
    display: none;
}

.element::-webkit-scrollbar { width: 0  }

Untuk Firefox/Edge: (Periksa Output firefox dan kemudian GTG)

html {
    scrollbar-width: none;
}

Poin Penting untuk dipertimbangkan sebelum menyembunyikan Scrollbar:

• Lebih disukai Sembunyikan scroll hanya ketika jika semua konten terlihat, pengguna lain dapat melewati konten
• Hindari scroll horizontal pada halaman Web dan jangan sembunyikan bilah gulir horizontal karena dapat membuat konten sulit dibaca

Terimakasih telah membaca artikel CSS : Cara Menghilangkan Scrollbar di Browser semoga bermanfaat.