how to make menu item header clickable in offcanvas - Forum | JoomShaper
Solved Helix Framework

how to make menu item header clickable in offcanvas

Asked by blue_Shift 4 years ago Last activity 4 years ago

I have an off-canvas menu and the arrows work - but an icon is too small a target. How can I turn the span.nav-header item become a toggler?

Accepted answer

Marked as the solution
Ariba Staff
4 years ago

Please add the following css rule in custom css section

.offcanvas-menu .menu-deeper ul li {
    display: flex;
    flex-direction: column;
}

.offcanvas-menu .menu-deeper ul li nav-header {
    position: relative;
}

.offcanvas-menu .offcanvas-inner ul.menu > li.menu-parent .menu-toggler {
    top: 50%;
    background: none;
    width: 100%;
    text-align: end;
    right: unset !important;
}

4 more replies

Oldest first Newest first Most helpful
Ariba Staff
4 years ago

Hello

Thank you for your query. Could you provide your site url, please? Also, kindly provide a screenshot as well. You can use Lightshot or any other tool of your choice to share the image here.

blue_Shift Asked this
4 years ago

I've provided a link in the hidden content as it is a staging site that will soon be switched to a live URL. Screen needs to be squished to turn on the off-canvas. I added some background to make the arrows bigger.

image

https://postimg.cc/WD4V4zz9

blue_Shift Asked this
4 years ago

Excellent. This behavior is what I think visitors will expect. Thank you.

Log in to reply.