When you see the ink Qi CMS menu, turn it into a toolbar. Change to think that all this has a meaning. Then continue to see how such a CMS sidebar is composed.
Requirejs and jquery Plugin Demo sample
A simple combination of proportions as seen below, add the following to the Main.js
Requirejs.config ({" shim": { "Jquery-cookie" : ["jquery"] }});
And then add it in another file.
define (["jquery"], function ($) { //join functions});
This allows us to complete the addition of a simple plugin.
Ink qi cms joins jquery plugin jquery Sidr
the Best JQuery plugin for creating side menus and the easiest-a-Z for doing your menu responsive
This is the best and simplest tool to create a responsive sidebar, so we need to download jQuery.sidr.min.js to the folder and then change the main.js:
Require.config ({ baseUrl: ' lib/', paths: { ' text ': ' Text ', jquery: ' Jquery-2.1.1.min ', async: ' Require/async ', json: ' Require/json ', mdown: ' Require/mdown ', router: '. /router ', templates: '. /templates ', jquerysidr: ' Jquery.sidr.min ', markdownconverter: ' Require/markdown.converter ' }, Shim: { jquerysidr:["jquery"], underscore: { exports: ' _ '}}} ); require ([' ... /app '], function (APP) { app.initialize ();});
Add Jquery.sidr.min to the inside.
JQuery Sidr and Requirejs collaboration
Cite the official Demo sample code
$ (document). Ready (function () { $ (' #simple-menu '). Sidr ();});
We need to add the above initialization code to the initialization of App.js,
define ([ ' jquery ', ' underscore ', ' backbone ', ' router ', ' JQUERYSIDR '], function ($, _, backbone , Router) { var initialize = function () { $ (document). Ready (function () { $ (' #menu '). Sidr (); }); Router.initialize (); }; return { initialize:initialize };});
This opens the Ink Qi CMS to see the final effect.
Related Resources
QQ Discussion Group: 344271543
Source Code Github:https://github.com/gmszone/moqi.mobi
Build a JavaScript-based mobile web cms--join the jquery plugin