在superset => templates => appbuilder 文件夹下找到 navbar.html 如果没有可对应新建,navbar.html内容如下

{% set menu = appbuilder.menu %}
{% set languages = appbuilder.languages %}
{% set WARNING_MSG = appbuilder.app.config.get('WARNING_MSG') %}
{% set app_icon_width = appbuilder.app.config.get('APP_ICON_WIDTH', 126) %}
{% set logo_target_path = appbuilder.app.config.get('LOGO_TARGET_PATH') or '/profile/{}/'.format(current_user.username) %} <div class="navbar navbar-static-top {{ menu.extra_classes }}" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="{{ '/superset' + logo_target_path if current_user.username is defined else '#' }}">
<img
width="{{ app_icon_width }}"
src="{{ appbuilder.app_icon }}"
alt="{{ appbuilder.app_name }}"
/>
</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
{% if WARNING_MSG %}
<li class="alert alert-danger">
{{ WARNING_MSG | safe }}
</li>
{% endif %}
{% include 'appbuilder/navbar_menu.html' %}
</ul>
<ul class="nav navbar-nav navbar-right">
{% include 'appbuilder/navbar_right.html' %}
</ul>
</div>
</div>
</div> <script>
// Highlight the navbar menu
const menus = document.querySelectorAll('.nav.navbar-nav li')
for (const menu of menus.values()) {
const classes = menu.getAttribute('class')
const as = menu.querySelectorAll('a')
for (const a of as.values()) {
const href = a.getAttribute('href')
let path = location.pathname
if (path.indexOf(href) > -1) {
menu.setAttribute('class', `${classes} active`)
} else {
menu.setAttribute('class', `${classes}`)
}
}
}
</script>

存在的问题:带有下拉菜单的不能高亮

Superset导航栏高亮问题处理的更多相关文章

  1. jquery导航栏高亮(二级菜单点击一级保持高亮)

    <script type="text/javascript"> var urlstr = location.href; var urlstatus=false; $(& ...

  2. phpcms 完美实现 导航栏当前栏目高亮

    我们在用phpcms做网站的时候,经常碰到导航栏高亮功能,或者侧栏高亮,这个会涉及到几个问题: .栏目列表页子栏目高亮判断,如果当前页面为子栏目,他的顶级栏目如果在导航栏也要高亮. .内容页高亮,这个 ...

  3. elementUI的导航栏在刷新页面的时候选中状态消失的解决

    首先elementUI的导航栏中的选中项的高亮显示时的字体颜色可以在属性中设置,但是高亮时的背景颜色不能设置,所以要自己修改高亮的背景颜色 .el-menu-item.is-active { back ...

  4. PHPCMS V9 导航栏当前栏目高亮

    实际上这个东西可有可无,很多站点看似导航栏当鼠标指向后都会变化等高亮处理,一般都比较醒目,但是实质点击过去后,都还是只是刚才的样式,因为这些站点的导航栏都没有对当前选中栏目做CSS的指定变化处理. 该 ...

  5. vue-router+elelment-ui,实现导航栏激活高亮

    <el-menu :default-active="$route.path" class="el-menu-vertical-demo" backgrou ...

  6. iOS开发笔记13:顶部标签式导航栏及下拉分类菜单

    当内容及分类较多时,往往采用顶部标签式导航栏,例如网易新闻客户端的顶部分类导航,最近刚好有这样的应用场景,参考网络上一些demo,实现了这种导航效果,记录一些要点. 效果图(由于视频转GIF掉帧,滑动 ...

  7. [iOS微博项目 - 1.1] - 设置导航栏主题(统一样式)

    A.导航栏两侧文字按钮 1.需求: 所有导航栏两侧的文字式按钮统一样式 普通样式:橙色 高亮样式:红色 不可用样式:亮灰 阴影:不使用 字体大小:15   github: https://github ...

  8. mui底部导航栏切换分页

    使用Hbuilder的mui框架开发移动端非常便利.高效: 底部导航栏切换功能也是移动APP开发中必须实现的: 引入mui文件.下面会用到jquery,同时引进 <link href=" ...

  9. element-ui使用导航栏跳转路由用法

    element-ui使用导航栏跳转路由用法 最近初学vue,试着做一个小项目熟悉语法与思想,其中使用elemen-ui的导航栏做路由跳转切换页面.下面记录一下学习过程 element-ui引入vue项 ...

  10. 根据location地址,在导航栏高亮显示当前页面

    获取当前页面的地址栏.与导航栏中所有<a> 标签的href属性 进行比较.如果相等则高亮显示 此<a>标签. 注意点:a 标签的href 属性在浏览器解析时 是绝对路径. a  ...

随机推荐

  1. 【FAQ】HarmonyOS SDK 闭源开放能力 —IAP Kit(2)

    1.问题描述: 应用内支付IAP Kit和Payment Kit的区别以及适用场景? 解决方案: IAP Kit是四方支付,仅支持在线虚拟商品,如会员,游戏钻石等,双框架支持全球,目前单框架暂时只支持 ...

  2. CSDN 大规模抓取 GitHub 上的项目到 GitCode,伪造开发者主页引公愤

    事件起因 CSDN旗下的GitCode最近因为一种极其不道德的行为引起了开发者的广泛愤怒和抗议.CSDN在没有通知或征求开发者同意的情况下,悄悄地将大量GitHub上的开源项目搬运到了其自己的GitC ...

  3. Freertos学习:04-任务的调试函数

    --- title: rtos-freertos-04-任务的调试函数 EntryName: rtos-freertos-04-task-debug date: 2020-06-22 08:49:06 ...

  4. Python_9 py文件导入和路径处理

    一.查缺补漏 Python中两个值交换可以直接交换如:a,b=b,a 冒泡就是从小到大排序,因为越到后越大 自动导包也适用于自己创建的模块 关于正斜杠和反斜杠https://www.cnblogs.c ...

  5. VS License Header Manager 插件

    /************************************************************************************* * * 文 件 名: %F ...

  6. ELK日志缺失问题排查-多行日志聚合Logstash配置问题

    1. 背景 推荐系统的推荐请求追踪日志,通过ELK收集,方便遇到问题时,可以通过唯一标识sid来复现推荐过程 最近在碰到了几个bad case,需要通过sid来查询推荐日志,但发现部分无法在kiban ...

  7. 微信小程序广告自动访问:让广告收益轻松翻倍的利器

    微信小程序流量主挂机刷广告脚本/机器人/助手 在当下这个数字化飞速发展的时代,微信小程序已经成为商家推广和吸引流量的重要平台.然而,对于很多小程序流量主来说,如何最大化地利用广告资源.提升广告收益,却 ...

  8. 转载 | ofd转pdf最好用的软件,ofd文件如何转化成pdf?

    1.背景 需要将ofd转换为pdf 2.使用方法 使用taurusxin 开发的软件Ofd2Pdf.exe即可实现,软件版权归原作者所有.这里表示感谢! 3.下载地址 官网:https://githu ...

  9. oeasy教您玩转vim - 65 - # 批处理操作

    ​ 批处理操作 回忆上次 我们上次参数列表 arguments list 所谓参数列表指的是 vim 打开的 参数列表 参数会加载到内存中成为 buffer 参数的控制 :arga filename ...

  10. Python pluggy框架基础用法总结

    代码为例进行说明 实践环境 Python 3.6.5 pluggy 0.13.0 例1 注册类函数为插件函数 #!/usr/bin/env python # -*- coding:utf-8 -*- ...