Bootstrap 3.0 Sliding Menu from left

Question

I've implemented a sliding menu from left to right in my bootstrap 3.0 website using mmenu. However, the performances in Android (samsung galaxy) are not ideal. I also have a default collapsing menu (nav- dropdown) which perform much better.

I was wondering if any of you guys has a solution to improve the left menu ? Is there any Bootstrap 3.0 component that would do that and be as smooth as the default dropdown ? (couldn't find anything mentioned in the doc) ? or any other recommendation ?

Nils

Look to getbootstrap.com/examples/offcanvas or #16872218 maybe – Garrity

Thanks buddy. I ended up using offcanvas indeed. Just few performance issues on other phones than iphones. – Nils

possible duplicate of Bootsrap 3 and mmenu – Deucalion

Answer 1

I believe that although javascript is an option here, you have a smoother animation through forcing hardware accelerate with CSS3. You can achieve this by setting the following CSS3 properties on the moving div:

div.hardware-accelarate {
     -webkit-transform: translate3d(0,0,0);
        -moz-transform: translate3d(0,0,0);
         -ms-transform: translate3d(0,0,0);
          -o-transform: translate3d(0,0,0);
             transform: translate3d(0,0,0);
}

I've made a plunkr setup for ya'll to test and tweak...

Dottiedottle

Answer 2

Probably late but here is a plugin that can do the job : http://multi-level-push-menu.make.rs/

Also v2 can use mobile gesture such as swipe ;)

Minneapolis

The link is broken – Gianna

Link still accessible with archive.org : web.archive.org/web/20200109020357/http://… – Minneapolis