Hi guys
Wondering if I can get the burger menu button to display on my site home page when it loads
Currently the site navigation hides the header area until you scroll down
It would be really useful to have the burger div visible though when the site loads thinking of having it visible in the top left of the home page at
okay guys i managed to do it
but it shows right away can you provide css transition to make it delay 3 seconds before showing?
Hi,
Try adding this css code in Quick CSS (located in Enfold > General Styling):
#top #avia-menu .av-burger-menu-main.menu-item-avia-special {
-webkit-animation: show-burger 5s;
-moz-animation: show-burger 5s;
-o-animation: show-burger 5s;
animation: show-burger 5s;
opacity: 0;
}
@keyframes show-burger {
0% {
opacity: 0;
}
25% {
opacity: 0;
}
50% {
opacity: 0.5;
}
100% {
opacity: 1;
}
}
@-webkit-keyframes show-burger {
0% {
opacity: 0;
}
25% {
opacity: 0;
}
50% {
opacity: 0.5;
}
100% {
opacity: 1;
}
}
@-moz-keyframes show-burger {
0% {
opacity: 0;
}
25% {
opacity: 0;
}
50% {
opacity: 0.5;
}
100% {
opacity: 1;
}
}
@-o-keyframes show-burger {
0% {
opacity: 0;
}
25% {
opacity: 0;
}
50% {
opacity: 0.5;
}
100% {
opacity: 1;
}
}
@keyframes show-burger {
0% {
opacity: 0;
}
25% {
opacity: 0;
}
50% {
opacity: 0.5;
}
100% {
opacity: 1;
}
}
Hope this helps. Just adjust the seconds :)
Best regards,
Nikko