Table of Contents:
00:00 – Intro
01:02 – Source of Inspiration
01:32 – Setting up Elementor plugin (Free Version)
02:22 – Create a New Page
03:57 – Add a Header Section
06:47 – Bonus Tip (Global Colors in Elementor)
07:59 – Add a Navigation Menu
12:42 – Defining CSS Classes on elements
14:28 – Adding CSS and JQuery for toggle effect
18:01 – Possible CSS Bug
19:55 – Making it Mobile Ready.
⬇️⬇️⬇️⬇️⬇️ Download CSS Here: https://github.com/adnanahmed/animate… ⬇️⬇️⬇️⬇️⬇️
=================
In this video, I am going to create a button to show and hide the navigation menu bar.
As you can see on the screen when I am clicking this plus icon, it shows the menu, and the icon is changing to cross. And when clicking again, it is hiding the menu, and the icon is changed back to the plus icon.
So it is a toggle action that is happening on the button.
And For this, I am going to use simple CSS.
Today I am going to create the Animated Menu Button to show and hide the header menu.
And this I am going to do in Elementor. I am going to use the Free version.
===================
✅ WordPress Themes & Plugins.
► Astra WordPress Theme: https://www.iadnanahmed
.com/recommends/astra-wordpress-theme/
► Elementor Pro Theme Builder: https://iadnanahmed.com/recommend…
✅ Equipment used to record my videos.
► Canon EOS 700D + EF-S 18-55mm 3.5-5.6 is STM – International Version – https://amzn.to/38kgCxb
► BOYA BY-M1 3.5mm Electret Condenser Microphone with 1/4″ adapter for Smartphones iPhone DSLR Cameras PC – https://amzn.to/2U1QHSu
► SOMITA St-3520 Lightweight 56″ Tripod – https://amzn.to/3l3Fflk
► Selfie Ring Light with Tripod Stand and Phone Holder – https://amzn.to/359HEWh
Disclaimer: This video and description contain affiliate links, which means that if you click on one of the product links, I’ll receive a small commission. It helps support the channel and allows me to continue to make videos like this. Thank you for your support!
=============
#adnanahmed, #webdeveloper, #webdevelopmenttutorials, #wordpresstutorials, #wordpress, #webdevelopment
