Merhabalar,
Bu yazımda Html, Css ve Javascript kullanarak nasıl açılıp kapanabilen yan menü yaparsınız bundan bahsedeceğim. Genelini Css ile yapacağımız bu özellik çok popüler olmasıyla birlikte yapımıda bir o kadar kolay, bende size bunu en basit ve sade şekilde anlatmaya çalıştım umarım beğenirsiniz.
Bu kodları, butonumuza tıkladığımızda ekranın sol tarafından bir menü genişleyecek şekilde yazacağım.
Hadi başlayalım;
Yukarıdaki Html kodlarımızda açılıp kapanabilir yan menümüz açıldığında menümüzün içeriği ne olacak menümüzün başlığı ne olacak bunları belirliyoruz.
Menümüzdeki yazılar vb. metin alanlarını kendinize göre düzenleyebilirsiniz.
Evet buradaki Css kodumuz ile yan menümüz açıldığında arkaplan renkleri nasıl olacak metin büyüklükleri ve renkleri nasıl olacak vb. özellikleri belirliyoruz. Css ile yapacağımız temel işlerde bu kadar.
Yukarıdaki Javascript kodlarımızda kapanıp açılabilir yan menümüzün açılış ve kapanış fonksiyonlarını ve bu fonksiyonların özelliklerini belirliyoruz.
İnceleyebilmeniz için Codepen üzerinden de size yapılan işlemi bırakayım.
See the Pen Untitled by Hüseyin Çınar (@huseyin-cinar) on CodePen.
Evet sizde bu şekilde test edebilirsiniz. Umarım işinize yarar.
Mutlu Kodlamalar :)
