javascript - Slideout from left push menu navigation -
so, want use menu button 'show/hide left push menu' working, reason when try , remove other buttons, stops working?
i haven't included css don't think issue can include link css file if needed.
html:
<body class="cbp-spmenu-push"> <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-left" id="cbp-spmenu-s1"> <h3>menu</h3> <a href="#">celery seakale</a> <a href="#">dulse daikon</a> <a href="#">zucchini garlic</a> <a href="#">catsear azuki bean</a> <a href="#">dandelion bunya</a> <a href="#">rutabaga</a> </nav> <button id="showleft">show/hide left slide menu</button> <button id="showright">show/hide right slide menu</button> <button id="showtop">show/hide top slide menu</button> <button id="showbottom">show/hide bottom slide menu</button> <section class="buttonset"> <h2>push menus</h2> <button id="showleftpush">show/hide left push menu</button> <button id="showrightpush">show/hide right push menu</button> </section> </body> js:
var menuleft = document.getelementbyid('cbp-spmenu-s1'), showleftpush = document.getelementbyid('showleftpush'), body = document.body; showleft.onclick = function () { classie.toggle(this, 'active'); classie.toggle(menuleft, 'cbp-spmenu-open'); disableother('showleft'); }; showright.onclick = function () { classie.toggle(this, 'active'); classie.toggle(menuright, 'cbp-spmenu-open'); disableother('showright'); }; showtop.onclick = function () { classie.toggle(this, 'active'); classie.toggle(menutop, 'cbp-spmenu-open'); disableother('showtop'); }; showbottom.onclick = function () { classie.toggle(this, 'active'); classie.toggle(menubottom, 'cbp-spmenu-open'); disableother('showbottom'); }; showleftpush.onclick = function () { classie.toggle(this, 'active'); classie.toggle(body, 'cbp-spmenu-push-toright'); classie.toggle(menuleft, 'cbp-spmenu-open'); disableother('showleftpush'); }; showrightpush.onclick = function () { classie.toggle(this, 'active'); classie.toggle(body, 'cbp-spmenu-push-toleft'); classie.toggle(menuright, 'cbp-spmenu-open'); disableother('showrightpush'); };
this how adapt http://tympanus.net example bottome button , best go through id's , understand being triggered , when
<body class="cbp-spmenu-push"> <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-right" id="cbp-spmenu-s2"> <h3>menu</h3> <a href="#">celery seakale</a> <a href="#">dulse daikon</a> <a href="#">zucchini garlic</a> </nav> <div class="container"> <header class="clearfix"> </header> <div class="main"> <section class="buttonset"> <button id="showrightpush">show/hide right push menu</button> </section> </div> </div> <script src="js/classie.js"></script> <script> var menuright = document.getelementbyid( 'cbp-spmenu-s2' ), showrightpush = document.getelementbyid( 'showrightpush' ), body = document.body; showrightpush.onclick = function() { classie.toggle( this, 'active' ); classie.toggle( body, 'cbp-spmenu-push-toleft' ); classie.toggle( menuright, 'cbp-spmenu-open' ); }; </script> </body>
Comments
Post a Comment