Yandan Açılan Menü Yapımı : HTML + CSS + JS

Поделиться
HTML-код
  • Опубликовано: 6 сен 2017
  • Merhaba,
    Bu dersimizde HTML, CSS ve Javascript kullanarak yandan açılan ve kapanan menü oluşturduk.

Комментарии • 78

  • @ayberkbayraktar2289
    @ayberkbayraktar2289 Год назад

    Elinize, ağzınıza sağlık hocam. Gerçekten çok güzel anlatmışsınız ve gerçekten çok yardımcı oldu.

  • @BurakinComputer
    @BurakinComputer 4 месяца назад

    Emeğinize sağlık hocam.

  • @batuhanbulduk4786
    @batuhanbulduk4786 5 лет назад +1

    Allah razı olsun abi

  • @mertinan8222
    @mertinan8222 5 лет назад +1

    harika anlatım teşekkürler 😍👏

    • @leonardnehemiah498
      @leonardnehemiah498 3 года назад

      You probably dont care but if you guys are bored like me atm then you can stream all the new movies on instaflixxer. Been streaming with my gf for the last couple of months =)

    • @rogershepherd9995
      @rogershepherd9995 3 года назад

      @Leonard Nehemiah definitely, been watching on Instaflixxer for since december myself :D

  •  6 лет назад +2

    Çok güzel bir anlatım olmuş. Bu menüyü masaüstünde normal ve mobilde bu şekilde gösteriminide bir ders olarak çekerseniz çok daha faydalı olur. Elinize sağlık.

  • @sudenazbalci
    @sudenazbalci 3 года назад

    Çok çok teşekkür ederiz harika bir anlatım

    • @ArinYazilim
      @ArinYazilim  3 года назад +1

      Alırım bi abonelik o zaman :)

  • @tuna4980
    @tuna4980 5 лет назад

    Hocam kolay gelsin acil yardim edin. Ben ilk basta indexi hazirlayip siteyi actigimda site hic bisey gelmiyor lutfen yardim

  • @aratcesur6805
    @aratcesur6805 4 года назад

    ADAMSIN takip etim like attım 👍

    • @ArinYazilim
      @ArinYazilim  4 года назад

      Saol arkadaşım, son videolarim daha basarili bilgin olsun..

  • @mehmett7534
    @mehmett7534 6 лет назад

    emeginize saglık

  • @enescan8769
    @enescan8769 4 года назад

    Hocam hoverdaymış gibi oluyor butona tıkladığımda ve bıraktığımda geri dönüyor. Baktım baktım ama bulamadım.

  • @ArduinoTurkBatu
    @ArduinoTurkBatu 3 года назад +1

    SÜPER!!!!

  • @liqurbanov9723
    @liqurbanov9723 4 года назад

    Haminiza salamlar mənda bars iconu bağlandı arxaya açılmır . Arxaya açılması üçün nə edə bilərəm

  • @gulmantarayici3133
    @gulmantarayici3133 6 лет назад

    Hocam merhaba, menü solda tamamen kaybolmadan, buton genişliği kadar ince bir sıra halinde ve ikonları olan bir şekilde kalabilir mi? Ve üzerine gelince sadece o satır ve içindeki menü görünebilir mi?

    • @ArinYazilim
      @ArinYazilim  6 лет назад +4

      Evet görülebilir. Bunun için menüleri oluştururken textlerin yanına iconları koyabilirsiniz. Sonra da media queryleri içerisine textler için display hidden kullanabilirsiniz.

  • @mahmuthayirli8714
    @mahmuthayirli8714 4 года назад +1

    Eline sağlık hocam 👍🏼

  • @CooLFancy
    @CooLFancy 6 лет назад +2

    merhaba ben sizinle birlikte yaptim fakat butona tıklayinca geliyor mouseden elimi çekince gidiyor anlik hemen sebebi nedir ?

    •  5 лет назад

      bendede aynı sorun oldu :/

    • @astroONE1
      @astroONE1 4 года назад

      CooLFancy kodu gözden geçir

  • @busrayapc5608
    @busrayapc5608 6 лет назад

    hocam peki sagda kalan boşluga hakkımızda yazısına tıklayınca poliçe gelmesini nasıl saglayabiliriz? yani aynı sayfada sola tıklayınca sagda birşeyler çıkacak

    • @ArinYazilim
      @ArinYazilim  6 лет назад

      Büşra Hanım derslerimde "Çok Sayfalı Psd To HTML" dersi var, onu izleyin tam olarak aradığınız proje.

  • @NumanBoran1
    @NumanBoran1 Год назад

    Hocam tebrikler çok başarılı olmuş. Benim yapmak istediğim şey ikon yukarda sabit olacak. İkona tıklandığında altından bir side menu gelecek ama ikon sabit duracak, kendisi de gelmeyecek burada yaptığınız gibi. Nasıl yaparım?

  • @cuneytgunes8059
    @cuneytgunes8059 3 года назад

    sa hocam oraya arama butonu koymak istiyorum nasıl yapmam gerekli
    mobile uyumlu için

  • @omerfarooqdemir9907
    @omerfarooqdemir9907 4 года назад

    Hocam CSS de . Ve # işareti arasındaki fark nedir . Yerine # kullansam veya hepsini # yapsam sorun olurmu

    • @ArinYazilim
      @ArinYazilim  4 года назад +1

      Olmaz!. # ile id yi gösteririz, . ile is bir class ' ı gösteririz. CSS Class ' ı tekrar tekrar kullanırız, ID ise tek sefer kullanılır.

  • @aardau
    @aardau 3 года назад

    hiç bir şey anlamadım ama gene de sevdim çok samimi

  • @cagatayemre
    @cagatayemre 6 лет назад

    Hocam videolarınız çok güzel umarım daha iyi yerlere gelirsiniz, yakın zamanda değeriniz bilinecektir eminim. Acaba menü üzerine gelince arkaplan yukarıdan aşağıya kayarak inen tarzda veya mouse ile üzerine gelince arkaplanın renk değiştirip sağdan sola doğru arkaplanın değiştiği tarz videolar çekebilir misiniz birkaç kaynak buldum ancak karışık geldi açıkçası direkt al düzenle yapıştır geç yapmak da istemiyorum. İyi çalışmalar.

  • @kdrcnuzmcu
    @kdrcnuzmcu 6 лет назад

    leftSidebar içine "left: -200px;" yazınca side bar sola gidiyor ama button 200px konumunda kalmaya devam ediyor

    • @GurhanArslanTR
      @GurhanArslanTR 4 года назад +2

      Büyük ihtimal projeyi silmişsindir ya da öğrenmişsindir :) ama yine de başka arkadaşlar için yazayım;
      style.css;
      .leftsideButton.active2{
      left:200px;
      }
      main.js;
      oluşturulan function'un içersine bir de
      document.getElementsByClassName('leftsideButton')[0].classList.toggle('active2');
      eklendiğinde sorun düzeliyor.

  • @AhmedG571
    @AhmedG571 7 месяцев назад

    usta yaptığımız bu yan menünün yaptığımız sitede her sayfasında çıkmasını nasıl yapacağız. bir sayfa yada vide varsa cevap a yazarmısın.

  • @wothern6276
    @wothern6276 4 года назад

    Abi benim menüm center ile ortaladım basınca aşağıya doğru açılıyor Aşağıyı nasıl tanımlayacağım örneğin sol left ise aşağı nedir ?

  • @sezertosun3004
    @sezertosun3004 4 года назад +1

    bende çalışmıyor kodlar 2 kez denedim

  • @asametr
    @asametr 3 года назад

    Hocam video içerikleri çok güzel fakat videolar bir tık uzun. Teşekkürler

    • @ArinYazilim
      @ArinYazilim  3 года назад +3

      Ne yapayım bir kısmını anlatmayayım o zaman :)

  • @Menzilliahmet
    @Menzilliahmet 3 года назад +2

    ben o simgeyı yapmak için kodu yazıyorum fakat bende içi boş bi kare yapıyo hiç bi kodumda hata yok neden ?

    • @ArduinoTurkBatu
      @ArduinoTurkBatu 3 года назад +1

      Şu kodu simge kodununun bulunduğu yerin altına yazdın mı (css kodları):
      font-family: FontAwesome;
      HTML kodlarında şu kodu bölümüne yazdın mı:
      veya kodları Ctrl+S veya Command+S ile kaydettin mi?

    • @Menzilliahmet
      @Menzilliahmet 3 года назад

      @@ArduinoTurkBatu hepsini bi kontrol ediyim

    • @ArduinoTurkBatu
      @ArduinoTurkBatu 3 года назад

      @@Menzilliahmet TAMAM

  • @mustafatas3391
    @mustafatas3391 3 года назад

    Çok İyi Anlatım Teşekkürler Hocam.

  • @bedirhanozcan4670
    @bedirhanozcan4670 4 года назад +2

    herşerşeyi doğru yaptım ama tıklayınca olmuyor

  • @ardanucakar
    @ardanucakar 6 лет назад

    Hocam anlatımlarınız güzel. Siteye canlı destek eklemek hakkında bir bilginiz var mı acaba ?

  • @erenyldrm6413
    @erenyldrm6413 5 лет назад

    Hocam harikasın 👍

  • @mustafaaltuntas3396
    @mustafaaltuntas3396 3 года назад

    Teşekkürler

    • @ArinYazilim
      @ArinYazilim  3 года назад

      Ben teşekkür ederim Mustafa.

  •  5 лет назад

    ben sizinle birlikte yaptim fakat butona tıklayinca geliyor mouseden elimi çekince gidiyor anlik hemen sebebi nedir ?

    • @duhan3192
      @duhan3192 5 лет назад

      buldun mu çözümü bende de aynı sorun var

    •  5 лет назад

      Yok Kardeş Hala Bulamadım Bizim Hocaya Götürdüm O Bile Yapamadı Bilmiorm Artık Üstelik O 16 Kod Dili Felan Bliyo Yani Nasıl Bir Hataysa

    • @recepyardim2392
      @recepyardim2392 4 года назад

      active yeriner hover kullanın daha kullanışlı olur javascript kodunda da active yerine hover yazın

    • @berfinteke4510
      @berfinteke4510 2 года назад

      @@recepyardim2392 Çok teşekkürler

  • @hamzaakyuz1244
    @hamzaakyuz1244 5 лет назад

    hocam slidebar kısmı gelmiyor bende doğru yazmama rağmen

    • @ArinYazilim
      @ArinYazilim  5 лет назад

      Hamza merhaba, herhangi bir hata mesajı alıyor musunuz? Javascript kodlarını kontrol ettinizmi?

    • @hamzaakyuz1244
      @hamzaakyuz1244 5 лет назад

      Arin Yazilim evet kontrol ettim herhangi bir hata yok

    • @sezertosun3004
      @sezertosun3004 4 года назад

      @@hamzaakyuz1244 bende de gelmiyor hepsi doğru yazıldı siz sorunu çözdünüz mü ?

  • @sanpuma
    @sanpuma 3 года назад

    Peki mesela anasayfaya basınca linke aktarmasını nası yapıcaz

  • @erd4575
    @erd4575 3 года назад

    Kendinize eziyet çektirmeyin Webstorm ve VSC de ! Basıp taba basarsanız head body meta etiketleri hazır geliyor

  • @bektasoglumusa
    @bektasoglumusa 4 года назад

    Öncelikle sade ve anlaşılır anlatımınız için teşekkür ederim. Ben anlatımınızı alt kısımda butona tıklandığında yukarı açılan bir div şeklinde yaptım. Ancak div açıldığında sadece butona tıkladığımda geri kapanmasını istiyorum. Burda açılan div in içinde herhangi bir yere tıkladığımda da div kapanıyor. Bu çözemedim.

  • @blackmamba1356
    @blackmamba1356 5 лет назад +1

    Abi bana yardımcı olur musun biraz uzun ama lütfen oku:
    Şimdi ben abim için bir blog açtım ama bilgim falan yok blogun adı :221btuna.blogspot.com
    Sorun şu sitede aynı videodaki gibi yandan açılan menü var(hazır tema) ve benim abim o menüde sadece yazarların ismi olsun ve tıkladığında o yazarın yazıları sıralansın istiyor. Fakat nasıl yapacağımı bilmiyorum . Abi bloga bi bakıp yardımcı olur musun şimdidn teşekkürler🙏🏻

    • @ArinYazilim
      @ArinYazilim  5 лет назад

      Gökay Merhaba, senin sorun Blogger arayüzü ile ilgili burdaki video bambaşka bir konu. Sen Blogger arayüzünde kategori oluşturacaksın. Şu video sana yardımcı olacaktır: ruclips.net/video/8Zbp3u9Ekfg/видео.html

    • @blackmamba1356
      @blackmamba1356 5 лет назад

      Abi bu saatte yardımın için çok sağ ol fakat o kategorilere tıkladığında yazarların yazılarının çıkmasını nasıl sağlıyacağım? Yazarın profilinin linkini koysam, yazarın profilinde yazıları gözükmüyor. Videonun yardımı dokundu fakat asıl sorunla ilgili önerebileceğin bir video yok sanırım, varsa bilgilendirirsen çok mutlu olurum. Tekrardan çok sağol abi🙏🏻

    • @ilkert10
      @ilkert10 5 лет назад

      @@blackmamba1356 oradaki menülerin ismini değiştir linkleri konuların linklerine ver. Bu kadar(tabi kastettiğin buysa)

  • @ArdaAcici23
    @ArdaAcici23 3 года назад

    kodalrı atsana knk

  • @ahmetbuber2959
    @ahmetbuber2959 3 года назад

    abi sen (element):before kullandınya aslında class mantığınıda kullanabilirsin şu örnekdeki gibi




    Document

    #p2 {
    background-color: #eee;
    }
    nav {
    height: 70px;
    }
    .btn {
    margin-top: 20px;
    float: right;
    display: inline-block;
    margin-right: 20px;
    }
    .btn1 {
    margin-right: 20px;
    margin-top: 20px;
    display: inline-block;
    float: right;
    }
    #title {
    display: inline-block;
    }

    #btn2 {
    font-size: 28px;
    background: orange;
    padding: 5px 10px;
    }






    ritfomore

  • @BatymeisteR
    @BatymeisteR 6 лет назад

    Menü butonlarına tıklayınca başka sayfaya yönlendirmeyi nasıl yapacağız?

    • @vugarbakhishli7759
      @vugarbakhishli7759 5 лет назад

      Home .Bu şekilde olmalı

    • @beratkisi1017
      @beratkisi1017 5 лет назад +1

      sen daha link yönlendirmeyi öğrenmeden burayamı geldin :)

  • @canahmetyuce2860
    @canahmetyuce2860 6 лет назад

    abi kullandığın programın adı ne

  • @ychvideo
    @ychvideo 4 года назад

    abi denedim olmuyor bi kodları açıklamaya yazsaydın çok zor bir şey değildi altı üstü ctrl c ctrl v yapıcaktın biterdi yani...;((

    • @ArinYazilim
      @ArinYazilim  4 года назад +3

      Vaayy harbi mi? Videoya da gerek yoktu o zaman, hani emek veriyoruz yayınlıyoruz ya..