layui左侧菜单栏,鼠标悬停显示菜单文字

layui封装的左侧菜单是固定宽度的,且左侧菜单栏在css里改变宽度,效果并不是很好(还设计头部菜单栏),如果写js来让菜单栏能够拉伸,也比较麻烦,那怎么最简单的,让用户看到菜单的文字呢。使用鼠标悬停事件:

显示效果,发现如果文字过多,会自动省略,能够鼠标悬停上去显示全部,才是用户想看到的效果。

给左侧菜单栏添加监控:

            $('.layui-nav-child a').on({              mouseenter: function () {var that = this;var tips;var fullText = that.textContent;//console.log(that.textContent)tips = layer.tips("<span style='color:#000;'>" + fullText + "</span>", that, { tips: [2, '#fff'], time: 0, area: 'auto', maxWidth: 500 });},mouseleave: function () {layer.close(tips);}});

 思路就是,先判断子菜单的通用属性,然后可以打印一下看看子菜单dom下有哪些属性,然后绑定显示 title菜单文字的属性即可;

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/23974.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

从混乱到有序:PDM系统如何优化物料编码

在现代制造业中&#xff0c;物料管理是企业运营的核心。物料编码作为物料管理的基础&#xff0c;对于确保物料的准确性、唯一性和高效性至关重要。随着产品种类的不断增加和产品变型的多样化&#xff0c;传统的物料编码管理方式已经不能满足企业的需求。本文将探讨产品数据管理…

SpringSecurity6从入门到实战之默认用户的生成流程

SpringSecurity6从入门到实战之默认用户的生成流程 这次还是如标题所示,上一章我们的登录页面已经知道是如何生成了.那么,我们通过表单登录的user用户以及密码SpringSecurity是如何进行生成的呢? 默认用户生成 让我们把登录流程重新拉回到读取/META-INF/spring/ .imports文件 …

什么是MES系统?有什么作用?

MES系统解决方案是专门针对制造企业设计&#xff0c;在MES系统的应用下&#xff0c;实现专业的工厂、车间生产信息化管理方案&#xff0c;帮助制造企业提高生产效率。针对目前制造行业的生产管理状况&#xff0c;以及提升企业生产效率和企业竞争力的需求&#xff0c;实施MES系统…

《尚庭公寓》项目部署之Docker + Nginx

docker rmi nginx docker pull nginx docker rm -f nginx #先创建一个简易的nginx容器&#xff08;后面会删&#xff09;&#xff0c;然后通过 docker cp命令把容器里面的nginx配置反向拷贝到宿主主机上。 docker run --name nginx -p 80:80 -d nginx# 将容器nginx.conf文件复…

小猪APP分发:高效的APP托管服务分发平台

有没有遇到过这样的尴尬&#xff1f;辛辛苦苦开发了一个APP&#xff0c;却在托管和分发环节卡壳。想想看&#xff0c;花了那么多时间精力开发的APP&#xff0c;却因为分发不顺利而影响用户体验&#xff0c;实在是让人抓狂。而小猪APP分发就成了你最好的选择。 APP封装分发www.…

pypi 发布自己的包

注册pypi个人用户 网址&#xff1a;https://pypi.org 目录结构dingtalk_utils 必须-pkgs- __init__.py .gitignore LICENSE 必须 README.md 必须 requirements.txt setup.py 必须安装依赖 pip install setuptools wheel安装上传工具 pip install twinesetup.py i…

PHP质量工具系列之php-depend

php-depend是一个开源的静态代码分析工具&#xff0c;它的主要功能包括&#xff1a; 代码质量分析 复杂度度量&#xff1a;计算类、方法和函数的Cyclomatic Complexity&#xff08;循环复杂度&#xff09;&#xff0c;帮助识别潜在的复杂代码段。 耦合度度量&#xff1a;分析类…

推荐网站(20)ai工具集,你想要的ai工具里面都有

今天&#xff0c;我要向您介绍一个综合性的在线平台——AI工具集&#xff0c;这是一个集成了多种人工智能工具的网站&#xff0c;旨在为用户提供一站式的智能解决方案。无论您是专业人士、创意工作者&#xff0c;还是仅仅对AI技术感兴趣的普通用户&#xff0c;AI工具集都能满足…

Pico4 MR Unity零基础开发之获取手柄按键

一、导入示例资源 1、打开Package Manager面板&#xff0c;导入示例资源。 2、打开示例场景&#xff0c;方面后面测试。 二、打开 XRI Default Input Actions 三、设置XRI Default Input Actions 面板参数 1、点击号新增一项&#xff0c;重命名为Pico 2、新增并重命名Action …

springboot启动配置文件-bootstrap.yml常用基本配置

4.1.5.配置文件 SpringBoot的配置文件支持多环境配置&#xff0c;基于不同环境有不同配置文件&#xff1a; 说明&#xff1a; 文件说明bootstrap.yml通用配置属性&#xff0c;包含服务名、端口、日志等等各环境通用信息bootstrap-dev.yml线上开发环境配置属性&#xff0c;虚…

PICRUSt2在微生物功能预测分析中的应用解读

谷禾健康 微生物组学研究现已超越微生物群落组成分析得到更广泛的使用。大量的人类微生物组研究证据表明&#xff0c;肠道微生物组的功能变化对炎症和免疫反应的影响起到关键的影响作用。 16S rRNA分析是微生物组研究作为最常用便捷且具有成本效益的测量技术&#xff0c;用于分…

springboot+minio+kkfileview实现文件的在线预览

在原来的文章中已经讲述过springbootminio的开发过程&#xff0c;这里不做讲述。 原文章地址&#xff1a; https://blog.csdn.net/qq_39990869/article/details/131598884?spm1001.2014.3001.5501 如果你的项目只是需要在线预览图片或者视频那么可以使用minio自己的预览地址进…

Java面试——中间件

OpenFeign 1、openFeign是一个HTTP客户端&#xff0c;它融合了springmvc的注解&#xff0c;使之可以用REST风格的映射来请求转发。 2、可以把openFegin理解为是controller层或是service层。可以取代springmvc控制层作为请求映射&#xff0c;亦或是作为service层处理逻辑&#…

Three.js和Babylon.js,webGL中的对比效果分析!

hello&#xff0c;今天分享一些three.js和babylon.js常识&#xff0c;为大家选择three.js还是babylon.js做个分析&#xff0c;欢迎点赞评论转发。 一、Babylon.js是什么 Babylon.js是一个基于WebGL技术的开源3D游戏引擎和渲染引擎。它提供了一套简单易用的API&#xff0c;使开发…

Threejs-02、坐标辅助器与轨道控制器使用

一、坐标辅助器 1、添加坐标辅助器 // 添加世界坐标辅助器 const axesHelper = new THREE.AxesHelper(2); scene.add(axesHelper);2、调整相机位置 //设置相机位置 camera.

卫星通信频段有哪些

卫星通信使用到的频段涵盖L, S, C, Ku, Ka等&#xff0c;而最常用的频段是C(4~8GHz)和Ku(12~18GHz)频段&#xff0c;而Ka(27-40GHz)频段是后起之秀。目前地球赤道上空有限的地球同步卫星轨位几乎已被各国占满&#xff0c;C和Ku频段内的频率资源被大量使用&#xff0c;而Ka频段的…

微软必应地图的三维实景功能

偶然看到微软必应地图的三维实景功能&#xff0c;由于比较感兴趣这方面的技术&#xff0c;所以试用了一下,感觉总体来说技术上比咱们自己的技术和设计要好很多。比如这个工具栏就设计的很简洁&#xff0c;人性化&#xff1a; 而且实景地图的范围也非常大&#xff0c;建立这么大…

webpack 优化构建速度的插件

1.HardSourceWebpackPlugin本地缓存 HardSourceWebpackPlugin这个插件比DLL动态链接库更优秀 HardSourceWebpackPlugin是webpack的插件&#xff0c;为模块提供中间缓存步骤。为了查看结果&#xff0c;您需要使用此插件运行webpack两次&#xff1a;第一次构建将花费正常的时间…

15天搭建ETF量化交易系统Day7—全自动化交易系统

搭建过程 每个交易者都应该形成一套自己的交易系统。 很多交易者也清楚知道&#xff0c;搭建自己交易系统的重要性。现实中&#xff0c;从&#xff10;到&#xff11;往往是最难跨越的一步。 授人鱼不如授人以渔&#xff0c;为了帮助大家跨出搭建量化系统的第一步&#xff0c;我…

HEXO博客常用命令(自用)

1、配置类命令 预览命令 hexo s 上传本地仓库&#xff1a; hexo g提交&#xff1a; hexo d更换主题&#xff1a;在_config.yml文件中&#xff1a;注意属性后面要跟着 # Extensions ## Plugins: https://hexo.io/plugins/ ## Themes: https://hexo.io/themes/ theme: vola…