Support Forums

Support Offline : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

How do I make my off canvas menu to slide on the left side?

Featured Lock Resolved Task
How do I make my off canvas menu to slide on the left side instead of right side, I want to move my menu from right to left please see attached file. My website is dev3.ayonaturals.com

Attachments (1)

  • men.png
    men.png 136.5 KB

7 Answers

Sifat - Staff

More than a month ago #Permalink
How do I make my off canvas menu to slide on the left side instead of right side, I want to move my menu from right to left please see attached file. My website is dev3.ayonaturals.com

Hi there,
Thanks for your query. Please, copy the css code into the custom css to get your desired output.

.offcanvas-menu {
top: 0px;
left: -1000px;
}
.slide-top-menu .offcanvas-menu {
left: 0;
}



- Best regards.

jcamo

More than a month ago #Permalink
How will I make it smaller size?

berd

More than a month ago #Permalink
Hello,

Thanks for sharing the css code. I also want the same and i have added the .css to custom.css but for me it does not work. When i add the code the menu is gone and i only see the layer above it. What to do?

Sifat - Staff

More than a month ago #Permalink
Hello,

Thanks for sharing the css code. I also want the same and i have added the .css to custom.css but for me it does not work. When i add the code the menu is gone and i only see the layer above it. What to do?

Hi,
Would you please share your site url here?

berd

More than a month ago #Permalink
Thanks for helping me out, the url is: https://www.cannonworks.nl/

Sifat - Staff

More than a month ago #Permalink
Thanks for helping me out, the url is: https://www.cannonworks.nl/

Hi,
Please use this css code

.offcanvas-menu {
transform: translateX(-320px);
left: 0 !important;
}
.offcanvas .offcanvas-menu {
left: 0 !important;
}
.offcanvas .off-canvas-menu-wrap {
left: 0 !important;
transform: translateX(320px);
}


-Thanks


There are no replies made for this post yet.
However, you are not allowed to reply to this post.

Leaderboard (30 days)

Sifat

Sifat

Total Accepted Answers: 122
Paul Frankowski

Paul Frankowski

Total Accepted Answers: 115
Toufiq

Toufiq

Total Accepted Answers: 62
Pavel

Pavel

Total Accepted Answers: 4
Mohammed Ahmed

Mohammed Ahmed

Total Accepted Answers: 2

100+

Templates

200,000+

Community Users

Newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us