Easy Native Webflow Full Screen Nav Bar - Completely Customiseable

Поделиться
HTML-код
  • Опубликовано: 16 янв 2025

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

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

    Im not sure If I followed this correctly, but every time I load the site or preview, the nav is always open? it seems to start the animation with nav open? any clues or help on this?
    Love the video by the way! been searching for something like this for a while!

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

      having the same issue, did you figure it out?

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

      @hi.val.design I am also having the same issue, did you manage to figure out?

    • @usarora
      @usarora 10 месяцев назад +4

      I Found the solution. Go to interaction and in the [CLOSE] part remove the initial states.

    • @hi.val.design
      @hi.val.design  9 месяцев назад

      Hey there, sorry for not replying earlier. I think @usarora might have managed to answer your question. Let me know if that didn't work ( if you are still having that issue ). Drop me a message on IG @value.ivanov

    • @arielmoisesmaradiagarodrig9707
      @arielmoisesmaradiagarodrig9707 8 месяцев назад

      it worked but i removed all the initials states from all in the Close animaton, but i have another problem, when i click it to closed the reaction is very slow, maybe it needs to reorders the frames?@@usarora

  • @abdallahali7137
    @abdallahali7137 4 месяца назад +3

    Sir you are the only one on RUclips who actually took the time to taught us how to properly make a beautiful nav bar on Webflow, and for that I wanna say thank you. You're pretty good at it too, you go straight to the point, you should make more tutorials like that. I learned a lot here, not only I learned how to make and animate a beautiful nav bar, but I also learned about LottieFiles, and since I use Figma to first make my design before using Webflow, I discovered that a LottieFiles plugin is also available on Figma ! So I literally animated my own burger icon thanks to that and animated my logo afterwards with After Effects and exported it as a json file. All thanks to your tutorial !

    • @hi.val.design
      @hi.val.design  4 месяца назад +1

      Oh wow, thank you for taking the time to write such a nice comment my friends. It goes a long way you know.
      Happy I helped, I only did this tutorial because I saw no one else resolve the problem I was facing at the time of making my website.

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

    Thank you so much for this amazing tutorial! Your clear explanations and step-by-step guidance made it so easy to animate my navigation bar in Webflow. I really appreciate the effort you put into creating this video. Keep up the great work!

  • @HDynasty
    @HDynasty 9 месяцев назад +1

    While I think there’s a general trend of Webflow tutorials being egregiously long, this was nice. You covered the basic implementation within 10 minutes. Cheers

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

    Thank you for posting this tutorial, I’m following it and it looks like webflow has made slight changes to some of the elements. I was able to make it work.

    • @hi.val.design
      @hi.val.design  3 месяца назад +1

      Hey thanks for the comment and I am super happy to hear you managed to push through and get it to work despite the changes to Webflow.

  • @SebastianSimonsen-j4d
    @SebastianSimonsen-j4d Год назад +1

    Cheers, Val. Very helpful

    • @hi.val.design
      @hi.val.design  9 месяцев назад

      No worries mate. Hope it helped.

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

    Great tutorial Val - keep up the good work

    • @hi.val.design
      @hi.val.design  Год назад

      Thank you for the support, Graeme! Means a lot

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

    just what I needed, thanks!

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

    Great video Val!

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

    More tutorials in webflow, please :D

    • @hi.val.design
      @hi.val.design  3 месяца назад

      Hey, I am not prioritizing it at the minute. I am very sorry. But thank you for the support!

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

    Awesome!!!

  • @Fyke816
    @Fyke816 6 месяцев назад +1

    They removed the Justify option, so how can I fix the text going to the left on closing?

    • @hi.val.design
      @hi.val.design  4 месяца назад

      I am sorry but I do not know the answer to that at the minute

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

      Hey man not sure if you still need the answer but under layout>Align>X , there is a dropdown and you can select "space between"

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

    top content very helpful

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

    Hi Val! thanks for the video, I managed to recreate it as a complete webflow newbie:) One things I don't understand though: how do you manage to close the menu automatically upon clicking on a link? I don't think you covered this step...Or am I missing something? TIA!

    • @hi.val.design
      @hi.val.design  7 месяцев назад

      Hey thanks for the comment.
      It was a while ago I did this tutorial but I believe if you want the menu to close upon clicking a link the interaction trigger must be set to the "navbar opens" see this section of the video for reference - ruclips.net/video/Wn8WS4YCTK4/видео.htmlsi=733mLJGYkJyTVRrX&t=708
      Let me know if this helps, if not don't hesitate to drop me a message on ig where I can try helping you a bit better!

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

    Was helpful but your sound was way too low, so I could not really hear your properly... Had to do a lot of back and forth before I got it well. Thanks anyways.

    • @hi.val.design
      @hi.val.design  7 месяцев назад

      Sorry about that. It did bug out for some strange reason. Will make sure to have crisp audio next time.