代码拉取完成,页面将自动刷新
一个简单通用的主页前端框架
一个基于layui、jquery实现的html主页架构
下载下来按照index.html使用 【测试:下载下来后使用HBuilder打开预览或其他工具,因为加载菜单和页面不用服务打开的话会有跨越问题】
比较简单三步就可以用起来了
// 初始化配置
configObj.init({
scrollTop: true, // 回到顶部
layui: '2.6.8', // 请根据使用版本修改此处(必须三位数)
search: '搜索...', // 布尔/字符串(字符串代表提示;如果设置为false,说明不需要显示,那么请删除index.html中的class="lay-tree-menu"标签)
//iframe: true, // 是否开启iframe模式
/*theme: {// 主题设置内容
'theme': 16, // 主题样式
'menu': 2, // 菜单类型
'page': true, // 标签页
'pageType': false, // 标签页圆角
'pageIcon': false, // 标签页图标
'logo': false, // 固定logo
'refresh': false, // 点击菜单刷新
'radius': true, // 选中菜单圆角
'anim': 2, // 页面动画效果
'leftScroll': true, // 菜单滚动条显示
'leftCloseChild': true // 关闭其他展开子菜单
}, */
});
data是菜单数据
configObj.loadMenu(data);
每次修改主题时就会触发这个回调操作
configObj.themeCallback = function(data){
console.log('主题设置:', JSON.stringify(data));
}
非iframe下使用方式
configObj.setTabUrl({
mid: 100001,
url: 'page/xxx.html',
mname: '某某菜单',
})
iframe下使用方式
window.parent.configObj.setTabUrl({
mid: 100001,
url: 'page/xxx.html',
mname: '某某菜单',
})
已经封装好了,以上就可以使用了!
一般主题我们可以对用户进行数据库一对一存储,如果觉得没有必要存储到数据库的话,我们可以存储到浏览器中,如下:
存储浏览器中的localStorage
var theme = {'theme': 16, 'menu': 2, 'page': true, 'logo': false, 'refresh': false, 'radius': true, 'anim': 2};
localStorage.setItem('lay_menu_theme', JSON.stringify(theme));
获取存储到localStorage的主题
var value = localStorage.getItem('lay_menu_theme');
var theme = JSON.parse(value);
默认左侧式菜单 可在主题处设置头部菜单 或者混合式菜单
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。
1. 开源生态
2. 协作、人、软件
3. 评估模型