码迷,mamicode.com
首页 > 其他好文 > 详细

一款名为Blue_Moon的后台模板的初步研究

时间:2016-04-29 17:00:24      阅读:165      评论:0      收藏:0      [点我收藏+]

标签:

其介绍曰,Blue Moon后台管理模板是一款适合微信公众平台后台的蓝色清爽风格模板。

1 先看下其效果

技术分享

表单效果;

技术分享

图表效果;

技术分享

界面元素;按钮等等;

技术分享

表格;

技术分享

左上角用户登录;

技术分享


技术分享


技术分享

左上角部分的代码结构如下;4个li项;

技术分享

2 总体结构

文件

技术分享

引用了jquery, jquery ui,bootstrap,jquery.flot.js是

Flot是一个Jquery下图表插件,简单使用,交互效果,

技术分享

原来下载后这货给出的文件里都是demo;是不能直接改改用的;比如tables是全部表格的效果demo,forms是全部表单的效果demo;index是demo的开始页,不是一般后台的起始页;也没见到后台一般的左侧导航视图;要用的话还得自己做很多工作;

3 单个表格

下面看下其demo上的单个表格效果怎么做;从tables.html中去除多余代码,如下;

技术分享

单个表格效果;

技术分享

再去除多余,还剩下如下代码;这就是这个东西提供的单个表格;

技术分享

4 用understand分析

下面用代码分析工具来分析下下载的全部代码;

unserstand的简介见

http://blog.csdn.net/bcbobo21cn/article/details/51160712

新建一个understand项目,选择语言时去掉全部,只剩下web;

技术分享

选择和打开项目目录;

技术分享

看下understand自动生成的分析图表;

下图是文件之间的关系;比较乱;有空研究;

技术分享

这功能还不错,understand对选中的每个html文件可给出包含和调用的函数,应该是js函数,还没细看;

技术分享

这个也不错;每个html文件中的元素名称会被提取出来;

技术分享


资源下载

http://pan.baidu.com/s/1o7OEMc6

文件名

Blue_Moon.rar


一款名为Blue_Moon的后台模板的初步研究

标签:

原文地址:http://blog.csdn.net/bcbobo21cn/article/details/51251526

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!