首页 > 代码库 > 构建基于Javascript的移动web CMS——添加jQuery插件
构建基于Javascript的移动web CMS——添加jQuery插件
当看到墨颀 CMS的菜单,变成一个工具栏的时候,变觉得这一切有了意义。于是就继续看看这样一个CMS的边栏是怎么组成的。
RequireJS与jQuery 插件示例
一个简单的组合示例如下所示,在main.js中添加下面的内容
requirejs.config( { "shim": { "jquery-cookie" : ["jquery"] } } );
接着在另外的文件中添加
define(["jquery"], function($){ //添加函数 });
这样我们就可以完成一个简单的插件的添加。
墨颀CMS添加jQuery插件
jQuery Sidr
The best jQuery plugin for creating side menus and the easiest way for doing your menu responsive
这是一个创建响应式侧边栏的最好的也是最简单的工具,于是我们需要下载jQuery.sidr.min.js到目录中,接着修改一下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(); });
添加jquery.sidr.min到里面。
jQuery Sidr与RequireJS协作
引用官方的示例代码
$(document).ready(function() { $(‘#simple-menu‘).sidr(); });
我们需要将上面的初始化代码添加到app.js的初始化中,
define([ ‘jquery‘, ‘underscore‘, ‘backbone‘, ‘router‘, ‘jquerySidr‘ ], function($, _, Backbone, Router){ var initialize = function(){ $(document).ready(function() { $(‘#menu‘).sidr(); }); Router.initialize(); }; return { initialize: initialize }; });
这样打开墨颀 CMS便可以看到最后的效果。
相关资源
QQ讨论群: 344271543
源码 Github: https://github.com/gmszone/moqi.mobi
构建基于Javascript的移动web CMS——添加jQuery插件
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。