yano3nora
7/2/2017 - 11:06 AM

[jquery: mmenu sample] 少し前に流行ったドロワーメニューの実装プラグイン。jQueryでらくらくだね！ #jquery

[jquery: mmenu sample] 少し前に流行ったドロワーメニューの実装プラグイン。jQueryでらくらくだね！ #jquery

mmenu_sample.js
content_copyfile_download
// toggle menu [jQuery:mmenu]
$(document).ready(function(){
  $("#js-mmenu").fadeIn(500);  
  $("#js-mmenu").mmenu({
    // options
    extensions: ["tileview","theme-dark"],
    offCanvas: {
      position: "left",
      zposition: "front"
    },
    navbar: {
      title: "CONTENTS"
    }
  },{
    // configuration
    panelNodetype: "div, ul, ol",
  });
});
$(document).ready(function(){
  // sync open/close & icon animation
  $('.js-menu-trigger').on('click',function(){
    if($('.js-menu-trigger').hasClass('active')){
      $(this).addClass('active');
      var api = $("#js-mmenu").data("mmenu");
      api.close();
    }//if
  });
  $("#js-mmenu").data("mmenu").bind('open', function(){
    $('.js-menu-trigger').toggleClass('active');
  });
  $("#js-mmenu").data("mmenu").bind('close', function(){
    $('.js-menu-trigger').toggleClass('active');
  });
});