DEV Community

Discussion on: Hamburger CSS (no JS)

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀 • Edited
.navbar {
    will-change: transform;
}
Enter fullscreen mode Exit fullscreen mode

You will see a slightly smoother transform.

Also my issue with this technique is backwards navigation will continually open and close the menu if I clicked it a few times, it's in my history 😬.

Lastly you can embed codepen here on dev, you can even share it from codepen via their sharing mechanisms.

Collapse
 
ljcdev profile image
ljc-dev

True 😅. Thanks for the precious feedback! That IS a drawback. And I don't think it can be avoided because it's using links so the url is always going to get changed 🤔.
Will try "will-change" thx, haven't heard of it before.

Collapse
 
ljcdev profile image
ljc-dev

Didn't see the last part 😅, thanks for the tip!! Didn't know that was possible. Will try for sure next time 😀. Btw, are there shortcuts for emojis here? I'm copying and pasting from emojipedia 😅.

Collapse
 
akhilarjun profile image
Akhil Arjun

If you are on windows 10 just press win +.. It will open a built in emoji keyboard

Thread Thread
 
adam_cyclones profile image
Adam Crockett 🌀

If on a Mac with a touch bar you can say "so that's what this thing is good for" - "glad I didn't buy this machine" and use that.

Thread Thread
 
ljcdev profile image
ljc-dev

Lol 🤣🤣 .
Thx Akhil 😁! I'm using win.

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀

I blog on my phone 99% of the time so I couldn't say, no markdown shortcuts but you should check the guide when you post. Lots of nice tips.