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>

Layui侧边菜单导航禁用折叠“去除箭头样式”

 

解决方法

<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>

 

    A+
发布日期:2019年12月31日 20:05:57  所属分类:Layui
最后更新时间:2019-12-31 20:06:22
评分: (2 票;平均数5.00 ;最高评分 5 ;用户总数2;总得分 10;百分比100.00)
头像
UML建模视频教程:UML系统设计与建模 精讲
  • ¥ 58.0元
  • 市场价:58.0元
Python爬虫教程:零基础上手Scrapy分布爬虫
  • ¥ 388.0元
  • 市场价:388.0元
wp dz 帝国 dede phpcms等快速建站服务
wp dz 帝国 dede phpcms等快速建站服务
  • ¥ 999元
  • 市场价:4999元
Node.js视频教程:node.js全栈开发之路
  • ¥ 45.0元
  • 市场价:45.0元

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: