先看问题现象:

使用 layui 的左树功能,先在html页面添加左树功能引入

<ul class="layui-nav layui-nav-tree layui-nav-side">
<li class="layui-nav-item layui-this">
<a id="tree_menu_home" href="#">首页</a>
</li>
</ul>

然后再 js 代码中动态拼接 ul 下的 li 元素,显示出来的效果发现菜单栏无法展开,添加了一个初始化后,显示效果如下图:

element.init();

发现左树菜单栏的样式有点问题,鼠标悬浮1级菜单后样式不正确。

规避方案:

不要在 html 里面添加 ul 的定义,全部在 js 里面动态生成,然后拼接到 dom 元素上后 element.init(); 一下就可以了。

layui 动态左树导航栏显示样式BUG规避的更多相关文章

  1. uni-app动态修改顶部导航栏标题

    动态修改顶部导航栏标题有两种方法方式一.使用自定义到导航栏,覆盖原生导航栏 缺点:自定义到导航栏性能远远不如原生导航栏,手机顶部状态栏区域会被页面内容覆盖,这是因为窗体是沉浸式的原因,即全屏可写内容: ...

  2. phpcmsv9如何实现添加栏目时不在首页内容区显示只在导航栏显示

    之前王晟璟一直使用PHPCMSV9系统建过自己的个人门户网站,同时也建立了一个其他类型的网站,感觉非常不错,我不得不说PHPCMSV9的功能非常齐全,非常强大. 但有一点时常让王晟璟感到很烦脑,那就是 ...

  3. 微信小程序换皮肤,动态切换菜单栏和导航栏的样式,动态修改TabBar和NavigationBar

    在做微信小程序换皮肤的时候,需要动态修改菜单栏(TabBar)和导航栏(NavigationBar) 但是在小程序中它们的样式是写在app.json里面,而且app.json是静态编译,运行时哪怕你修 ...

  4. iOS 要定义自己的导航栏button样式Button Image 执行出彩是不一样的与原来的颜色 -解

    在相机闪光灯,在导航栏中自己定义"闪"样式.点击变换的图像期望,但一直没有变化.原来是该条款的Global Tint颜色.因此,系统会自己主动改变图片的颜色Global Tint颜 ...

  5. Swift - 修改导航栏的样式(文字颜色,背景颜色,背景图片)

    默认情况,导航栏UINavigationController的样式如下,如果想要使用代码修改样式也是比较简单的. 1,修改导航栏背景色 1 2 3 //修改导航栏背景色 self.navigation ...

  6. IOS 设置导航栏全局样式

    // 1.设置导航栏背景 UINavigationBar *bar = [UINavigationBar appearance]; [bar setBackgroundImage:[UIImage r ...

  7. uni-app实现顶部导航栏显示按钮+搜索框

    最近公司准备做app,最终决定使用uni-app框架开发,但是当把设计图给我的时候我心里有点没底,因为他的设计图顶部长成这个样子: 因为这个功能在小程序是根本无法实现的,可能受这个影响,我感觉好像实现 ...

  8. [转]layui点击左侧导航栏,实现不刷新整个页面,只刷新局部

    本文转自:https://blog.csdn.net/s31415926_004/article/details/84256587 其实这篇文章是给自己看的,以后忘记怎么做回来还能看一下哈哈哈哈哈哈哈 ...

  9. mono for android 自定义titleBar Actionbar 顶部导航栏 修改 样式 学习

    以前的我是没有做笔记的习惯的,学习了后觉得自己能记住,但是最近发现很多学的东西都忘记了,所有现在一有新的知识,就记下来吧. 最近又做一个mono for android 的项目 这次调整比较大,上次做 ...

随机推荐

  1. 全文检索(AB-1)-相关领域

    信息检索 认知科学 管理科学

  2. python用模块zlib压缩与解压字符串和文件的方法

    摘自:http://www.jb51.net/article/100218.htm Python标准模块中,有多个模块用于数据的压缩与解压缩,如zipfile,gzip, bz2等等. python中 ...

  3. codeforces 363A

    #include<stdio.h>//这题挺有意思小学学的算盘 int main() { int n,i,m; while(scanf("%d",&n)!=EO ...

  4. 常见问题:Linux安装Python3步骤、Windows无法利用pip

    Linux安装python3.6和第三方库的步骤: 我的Linux是CentOS 6.5版本 Linux下大部分系统默认自带python2.x的版本,最常见的是python2.6或python2.7, ...

  5. KSQL日期字段访问

    日期常量用法 KSQL中用日期常量必须用{ts'" + dateTime.ToString("yyyy-M-d HH:mm:ss") + "'} 正确写法: I ...

  6. msp430入门编程01

    msp430单片机最小系统 msp430入门学习 msp430入门编程

  7. 关于变量__name__的理解

    __name__ 1. 基本含义 如果是放在Modules模块中,就表示是模块的名字: 如果是放在Classs类中,就表示类的名字: 2. 模块中的意义 这里重点说一下模块中的意义,这个用法在pyth ...

  8. Delphi ADO的Lookup类型字段的问题

    关于ADO数据集控件中的Lookup类型字段,在其Lookupkeyfields属性指向的字段中存在NULL值的,就会出现'EOleException with message '发生未知错误',这个 ...

  9. [bzo1211][HNOI2004]树的计数_prufer序列

    树的计数 bzoj-1211 HNOI-2004 题目大意:题目链接. 注释:略. 想法: prufer序列有一个性质就是一个数在prufer序列中出现的次数等于这个prufer序列生成的树中它的度数 ...

  10. operamasks—omMessageTip的使用

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...