Ana içeriğe geç

Position: Sticky

Teknik1 dk

Merhaba !

CSS'te position özelliğinin absolute, relative, fixed gibi sık kullandığımız özellikleri yanında pek görmediğimiz ama çok işe yarayan sticky'den bahsetmek istiyorum.

Sticky

Position: sticky yaptığımız elemente birde top değeri girerek ekranda hangi bölgede yapışkan kalacağını belirlemiş oluyoruz. Sitelerde rast gelmişsinizdir, ekranın üst kısımlarında yer alan bir menü, sayfayı aşağı scroll ettiğinizde üste yapışık kalır.

Örnek olması açısından bir codepen sayfası hazırladım. Menüler verilen top değerine denk gelene kadar normal yerlerinde duracaklar. Scroll ettiğimizde top değerine eş geldiğinde o bölgede yapışık kalacaktır.

Codepen Canlı Önizleme

Arama paleti

Sayfa, yazı veya eylem ara