Responsive Navigation Menu Bar + Hamburger Menu Toggle - Only with CSS

Поделиться
HTML-код
  • Опубликовано: 26 апр 2020
  • Please subscribe: / @purecode7237
    In this video we create a responsive navigation manu bar with logo, only with CSS and HTML, NO javascript! Using media querys we toggle the hamburger menu (made pure with CSS) to open the menu on mobile and tables
    MORE SMOOTH TUTS:
    Pure CSS Parallax Effect on Scroll (no JS) - Smooth Parallax Scrolling with Fruits:
    • Pure CSS Parallax Effe...
    Pure CSS Scroll Snap Effect:
    • Pure CSS Scroll Snap E...
    Pure CSS Animated Text & Border Box Gradient Effect:
    • Pure CSS Animated Text...
    --------
    Music: Name of the Child - Motions
  • ХоббиХобби

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

  • @sajunara1177
    @sajunara1177 2 года назад +1

    Bestes Tutorial und das erste, das so richtig klappt :) vielen Dank!

  • @LuisGutierrez-pc7wp
    @LuisGutierrez-pc7wp Год назад

    This was most helpful! Saved my project. THANKS!

  • @anthonykiirucreative
    @anthonykiirucreative 10 месяцев назад

    Worked perfectly! Thanks.

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

    Thanks a lot bro!!! You safe my life 😄
    Blessings from Venezuela

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

    Thank you so much bro, you safe me from stress.

  • @Faith2472h
    @Faith2472h Год назад +1

    make more please, you're a legend

  • @mishachubenko3394
    @mishachubenko3394 5 месяцев назад +1

    You helped for my project !!! Thanks !!!

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

    Thanks a lot ... Bro...This video is very helpful to solve my problem of hamburger menu ...

  • @user-id5ct2de8v
    @user-id5ct2de8v Год назад

    big thanks who borned you bro...😊

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

    Thanks a lot bro your video solved my problem

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

    perfect

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

    Thank you

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

    awesome !!

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

    Thanks Bro🤩

  • @i-techbyjhomz5302
    @i-techbyjhomz5302 3 года назад +5

    can u please give source code, i dont know what the problem, not working for me

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

    Thnx buddy

  • @Nomadev
    @Nomadev 2 месяца назад

    Nice, very nice tutorial, but i have a problem when i pass to -768 the transition animation appears. Im doing mobile firts, the solution was delete the transition property of the menu, but now appears insta from right to left

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

    nice video

  • @programmers424
    @programmers424 Год назад +10

    why does nobody explain the code? they only show source code. what's the point of watching it

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

    Perfeito!!!!!

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

    been through this so many times and cant get it to work the source code would of been handy :(

  • @nestorivan112
    @nestorivan112 Год назад +1

    The responsiveness works for me but not when I click the hamburger 🤔
    What am I doing wrong?

  • @caudb854
    @caudb854 3 месяца назад

    I couldn't get "@media screen and (min-width: 992px)" to work.
    However, "@media only screen and (min-width: 992px)" did the trick.
    Add "only".

  • @user-rn3pt2gd6l
    @user-rn3pt2gd6l 6 месяцев назад

    sorry sir i need only code line that make navigation responsive

  • @monikdiwani1379
    @monikdiwani1379 3 месяца назад

    any can give source of the code or link plz...

  • @RAZASHARP
    @RAZASHARP 6 месяцев назад

    ummm thanks...link in description would be awesmome!

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

    What is the logic for checkbox even hamburger is placed ?
    Why all youtube tutorial has same method ?

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

    👏👏👏

  • @nicolaslondon
    @nicolaslondon Год назад +2

    not working

  • @prachi_s_h
    @prachi_s_h 3 года назад +8

    Thanks but can you give source code in the description??👍🙏🙏

    • @sanketsingh5555
      @sanketsingh5555 Год назад +2

      Behn jab chize samjh aa gyi toh code ki kya zaroorat khud code likho

    • @simpleasrough
      @simpleasrough 6 месяцев назад

      bhai hamara wala work nhi karta, kahi na kahi koye koye na koyi masla ajata hai
      @@sanketsingh5555

  • @geldelian
    @geldelian 5 месяцев назад

    where is the code

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

    👌👌👌👌👌👌👌💯💥

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

    Upload source code please

  • @maddox3223
    @maddox3223 9 месяцев назад

    For those who are not working type this when writing responsive code:
    @media (max-width: 992px)
    instead of:
    @media screen and (max-width:992px)

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

    source code

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