CSS ile kayan bir sidebar

[Zeberus]

CSS ile kayan bir sidebar (yan menü) oluşturmak oldukça basittir. Aşağıda, HTML ve CSS kullanarak bir örnek kod paylaşıyorum. Bu örnek, sayfa kaydırıldığında sabit kalan bir sidebar içerir.

HTML ve CSS Kodu​

HTML (index.html)​

html
Kodu kopyala

Lütfen, Giriş yap Veya Kayıt ol Kod içeriğini görüntülemek için!

CSS (styles.css)​

css
Kodu kopyala

Lütfen, Giriş yap Veya Kayıt ol Kod içeriğini görüntülemek için!

Çalışma Prensibi​

1. Sidebar sabitlenmiş (position: fixed) ve her zaman ekranın solunda görünür.
2. Content kısmı, margin-left kullanılarak sidebar için boşluk bırakır.
3. Menüdeki bağlantılar, sayfa içinde belirtilen ID’lere yönlendirilir (örneğin, #section1).

Bu kodu tarayıcınızda açarak kayan bir sidebarı görebilirsiniz! Geliştirmeler yapmak isterseniz, örneğin animasyon eklemek gibi, söyleyin, daha da detaylandırayım.