Cara - Elemen Lengket
Pelajari cara membuat elemen lengket dengan CSS.
Catatan: Contoh ini tidak berfungsi di Internet Explorer atau Edge 15 dan versi yang lebih lama.
Elemen Lengket
Contoh
div.sticky {
position: -webkit-sticky; /* Safari */
position: sticky;
top: 0;
}
Elemen dengan position: sticky;
diposisikan berdasarkan posisi gulir pengguna.
Elemen lengket beralih antara relative
dan fixed
, tergantung pada posisi gulir. Itu diposisikan relatif sampai posisi offset yang diberikan terpenuhi di viewport - lalu "menempel" di tempatnya (seperti position:fixed).
Catatan: Internet Explorer, Edge 15 dan versi sebelumnya tidak mendukung pemosisian tetap. Safari memerlukan awalan -webkit- (lihat contoh di bawah). Anda juga harus menentukan setidaknya satu dari top
, right
, bottom
atau left
agar penempatan tetap berfungsi.
Untuk mempelajari lebih lanjut tentang penentuan posisi CSS, baca tutorial Posisi CSS kami.