• Sunday , 10 December 2017

Folding Content Nav Menu CSS3 Animation JavaScript Tutorial

Code Canyon



Lesson Code: http://www.developphp.com/video/CSS/Folding-Content-Nav-Menu-CSS3-Animation-JavaScript-Tutorial
Learn to create various folding content effects with click triggers and toggle mechanisms. Learning these visual effects can greatly enhance your front-end design work. The best part is that it’s so simple to do, that no 3rd party frameworks or libraries are needed. The code is slim, and the visual effects are awesome.

CSS3 Property List
https://www.developphp.com/lib/CSS#Properties

Original source

3d Ocean

Related Posts

38 Comments

  1. Adnan khan
    September 19, 2017 at 10:23

    Just awesome teaching I have never seen. .before ..

  2. rot rose
    September 19, 2017 at 10:23

    Thank you. Your lessons make me think original instead of stealing other's code all the way which I actually do not understand too much. Your lessons are really genuine and enlightening. Thank you.

  3. Dobrica Menkovic
    September 19, 2017 at 10:23

    Hi Mr. Khoury, all praise for the tutorial. I would ask you for a proposal: how to convert the contents of a button to close? my attempt – menu.innerHTML = "Close"; do not work. Thanks a lot.

  4. sajal sangal
    September 19, 2017 at 10:23

    Hello Adam do you have a video telling to make different types of slideshows effects for images?

  5. jo kai
    September 19, 2017 at 10:23

    Hi Adam. Do you have a tutorial that explains the "data-opened/dataset.opened" things you used? Or if its easy, could you explain here please? I know some basic javascript , but havent come across that command yet…

  6. Chenghua Pang
    September 19, 2017 at 10:23

    the sound effect is on point

  7. Sandokan999 sasho
    September 19, 2017 at 10:23

    yeah so nice man im surching dor this anywhere

  8. shaikh faizan
    September 19, 2017 at 10:23

    sir this program making used jqurey

  9. Annette, Peter, Luna Steintjes
    September 19, 2017 at 10:23

    Many thanks for this great tutorial, the animation loks very difficult but it is so easy to accomplish.

    Many thanks from the Netherlands

  10. shaikh faizan
    September 19, 2017 at 10:23

    hello adam how are you my question is this video menubar is craeting <a href> but how to create <ul><li><a> same drop down please reply me

  11. Alexandre Iturres
    September 19, 2017 at 10:23

    Thanks Adam. A hug from Brazil.

  12. Jimmy Ellis
    September 19, 2017 at 10:23

    you are clearly the greatest genius that ever lived.

  13. Alfredo Neri
    September 19, 2017 at 10:23

    Thanks Adam, you're my hero again. A hug from México.

  14. Zhenhua Chen
    September 19, 2017 at 10:23

    where can i get the example code?

  15. Recapture Records
    September 19, 2017 at 10:23

    good look on the webdesignernews site i will check it out from now on

  16. Petru Guta Ciucur
    September 19, 2017 at 10:23

    Great work ! Thanks !

  17. Manni A
    September 19, 2017 at 10:23

    he sounds like he's high….. ughhhh

  18. Mirey Elmofti
    September 19, 2017 at 10:23

    Thank you so much !!!

  19. Pat Collins
    September 19, 2017 at 10:23

    You're an absolute genius and willing to share it. Thank's people like you make it all worthwhile getting up in the morning.

  20. geheim314
    September 19, 2017 at 10:23

    hey would be cool if you made a web video chat application!!

  21. Hassan Ilyas
    September 19, 2017 at 10:23

    buhuhahaha , Adam 😀 🙂

  22. Donald Walsh
    September 19, 2017 at 10:23

    Dude, you are like the best teacher on the web!

  23. Travis Chandler
    September 19, 2017 at 10:23

    I can get this to work with multiple buttons, but I want to make it so if 1 menu is open and another menu button is clicked the 1st menu closes and the second opens.

    I know its possible to do but i dont have a clue on how to do it

  24. Swift Menu Builder
    September 19, 2017 at 10:23

    Nice menu animation effects. Thanks

  25. Naziru Adam
    September 19, 2017 at 10:23

    I wish I could give you like 1000 thumb ups… pity I could give only 1…thanks for the piece. 🙂

  26. João Ferreira
    September 19, 2017 at 10:23

    could be better to style just the closed state as [data-opened=no]{}

  27. Pickle Rick
    September 19, 2017 at 10:23

    Gr8 fucking video man! I kind of like the perspective more at the 0px actually:P

  28. Mirey Elmofti
    September 19, 2017 at 10:23

    Hi Mr. Khoury, i am on my first "Prove your self to your self project :)))) " and i am actually still trying to learn from you and some other good coders on youtube , i have to admit, i really need to learn alot yet, html and css part is all great but when it comes to connection and php i keep receiving errors and the following is one of them, ( Deprecated: mysql_pconnect The mysql extension is deprecated and will be removed in the future: use mysqli or PDO instead ) and since i am so new i really couldnt find the correct way to fix it… i am sure its really easy for prof coders but for new students like me it just keeps imbarassing me to my self ): !!! can you make a small tut on how to use mysqli to connect to localhost instead of mysql ?? or at least inform me the correct code i must use ?? e-mail is : mireyelmofti2010@gmail.com Thanks alot 🙂 and i wish you the best !!! Be safe …

  29. The Hash
    September 19, 2017 at 10:23

    Adam, bro, you may also use the check box input and sibling selectors and the "checked" pseudo-selector to get this effect.

  30. MrFallenSkillz
    September 19, 2017 at 10:23

    You always surprise me like a magician.

  31. Random Tutorials
    September 19, 2017 at 10:23

    Keep up the good work Adam

  32. LiCkM3AkaBambii
    September 19, 2017 at 10:23

    sry, but i won't use javascript. only css3+ for design…
    next versions of css will do things like that possible, so i hope.

  33. MrShawnlloyd
    September 19, 2017 at 10:23

    That is pretty slick!

  34. Jay Mee
    September 19, 2017 at 10:23

    amazing

  35. Navneil Naicker
    September 19, 2017 at 10:23

    Nice

  36. ibrahim ismail
    September 19, 2017 at 10:23

    adam your such a great tutor.i was wondering if you can introduce a course of coding your develop php site as a project bringing all the tutorials you have been teaching.You can can charge it just as a token for ua work.i will be the first to sign up.Great work

  37. محمد ابراهيم
    September 19, 2017 at 10:23

    great work..

  38. Shuvo Khan
    September 19, 2017 at 10:23

    Thanks Adam

Leave A Comment

You must be logged in to post a comment.