构建基于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插件的更多相关文章
- 构建基于Javascript的移动web CMS——Hello,World
在一篇构建基于Javascript的移动web CMS入门--简单介绍中简单的介绍了关于墨颀CMS的一些原理,其极框架组成.于是開始接着应该说明一下这个CMS是怎样一步步搭建起来. RequireJS ...
- 构建基于Javascript的移动web CMS——模板
在上一篇<构建基于Javascript的移动CMS--Hello,World>讲述了墨颀 CMS的大概组成,并进行了一个简单的演示样例,即Hello,World.这一次,我们将把CMS简单 ...
- 构建基于Javascript的移动web CMS入门——简单介绍
看到项目上的移动框架,网上寻找了一下,发现原来这些一開始都有. 于是,找了个演示样例開始构建一个移动平台的CMS--墨颀 CMS,方便项目深入理解的同一时候.也能够自己维护一个CMS系统. 构建框架 ...
- javaScript学习总结(二)——jQuery插件的开发
概要 jQuery插件就是以jQuery库为基础衍生出来的库,jQuery插件的好处是封装功能,提高了代码的复用性,加快了开发速度,现在网络上开源的jQuery插件非常多,随着版本的不停迭代越来越稳定 ...
- 构建基于Javascript的移动CMS——生成博客(二).路由
在有了上部分的基础之后.我们就能够生成一个博客的内容--BlogPosts Detail.这样就完毕了我们这个移动CMS的差点儿基本的功能了,有了上节想必对于我们来说要获取一个文章已经不是一件难的事情 ...
- 构建基于Javascript的移动CMS——加入滑动
在和几个有兴趣做移动CMS的小伙伴讨论了一番之后,我们认为当前比較重要的便是统一一下RESTful API.然而近期持续断网中,又遭遇了一次停电,暂停了对API的思考.在周末无聊的时光了看了<人 ...
- JavaScript 一个进行枚举选择的jquery插件(仿easyui风格)
某次做项目要实现一个功能: 按星期选择一个连续的时间范围 比如:周一到周五,周六到周日 或 周六到周三 聪明的朋友马上想出办法:用两个选项为周一到周日的下拉列表实现,对 那样可以,但是我觉得不够友好, ...
- 7 款基于 JavaScript/AJAX 的文件上传插件
本文整理了7款基于JavaScript和AJAX的文件上传插件,这些插件基本上都能实现以下功能: 多文件上传 拖拽操作 实时上传进度 自定义上传限制 希望能为你的开发工作带来帮助. 1. jQuer ...
- 10个精选的颜色选择器Javascript脚本及其jQuery插件
Color picker即颜色选择器使我们在web开发中可能经常用到的组件,今天我们特意精选了10个超酷的颜色选择器实现,其中包括了javascript脚本 实现及其传说中的jQuery插件实现 ...
随机推荐
- asp.net 读取sql存储过程返回值
关于Exec返回值的问题有很多,在这做个简要的总结. 读查询语句示例: Declare @count int select @Count 要点: ...
- XMLHelper 类
这个XMLHelper类中包括了XML文档的创建,文档节点和属性的读取,添加,修改,删除的方法功能的实现,有兴趣的朋友,可以进来看看,所有代码都在WebForm和WinForm中调试通过. 这是下面 ...
- ASP.NET菜鸟之路之Request小例子
背景 我是一个ASP.NET菜鸟,暂时开始学习ASP.NET,在此记录下我个人敲的代码,没有多少参考价值,请看到的盆友们为我点个赞支持我一下,多谢了. Request获取值 Request获取值有两种 ...
- [500lines]500行代码写web server
项目地址:https://github.com/aosabook/500lines/tree/master/web-server.作者是来自Mozilla的Greg Wilson.项目是用py2写成. ...
- jquery选择器专题
$(“p”).addClass(css中定义的样式类型); 给某个元素添加样式$(“img”).attr({src:”test.jpg”,alt:”test Image”}); 给某个元素添加属性/值 ...
- jQuery键盘控制方法,以及键值(keycode)对照表
键盘控制应用范围非常广泛,比如快捷键控制页面的滚动:在填写表单时候,限制输入内容:或者是屏蔽复制.粘贴.退后等功能.这里说说用jQuery怎么来实现.个人觉得jQuery比原生态的JS好用,代码简单清 ...
- phpstorm 配置
JetBrains PhpStorm 8注册码一枚 username :cf96PiPYt271u1TC License Key : 97807-12042010 00001GctOKh8f206hl ...
- SQL2008数据库连接服务器为主机名时连接成功,服务器为Ip地址时链接失败
如图:
- JDBC驱动汇总
Microsoft SQL Server (6.5, 7, 2000 and 2005) and Sybase (10, 11, 12). ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ...
- WinPcap编程(前言&&学习)
计算机网络课设要求用WinPcap写对ARP包的接收与发送. 所以学了一下WinPcap的内容. 参考的博客: http://blog.csdn.net/htttw/article/details/7 ...