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.rhkb.cn/news/343134.html

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

相关文章

释放视频潜力:Topaz Video AI for mac/win 一款全新的视频增强与修复利器

在数字时代&#xff0c;视频已经成为我们记录生活、分享经历的重要方式。然而&#xff0c;有时候我们所拍摄的视频可能并不完美&#xff0c;可能存在模糊、噪点、抖动等问题。这时候&#xff0c;就需要一款强大的视频增强和修复工具来帮助我们提升视频质量&#xff0c;让它们更…

LabVIEW与Arm控制器之间的通讯

LabVIEW是一个强大的图形化编程环境&#xff0c;广泛应用于自动化控制、数据采集和测试测量等领域。而Arm控制器则是嵌入式系统中常用的处理器架构&#xff0c;广泛用于各种控制和计算任务。将LabVIEW与Arm控制器进行通讯控制&#xff0c;可以结合二者的优势&#xff0c;实现高…

推荐系统三十六式学习笔记:原理篇.近邻推荐07|人以群分,你是什么人就看到什么世界

目录 协同过滤基于用户的协同过滤背后的思想原理实践1、构造矩阵2、相似度计算3、推荐计算4、一些改进 应用场景&#xff1a;总结 谈及推荐系统&#xff0c;不得不说大名鼎鼎的协同过滤。协同过滤的重点在于协同&#xff0c;所谓协同&#xff0c;也就是群体互帮互助&#xff0c…

大模型安全技术实践 | RAG精确应对大模型敏感问题知识幻觉难题

一、引言 在大模型的实际应用落地过程中&#xff0c;会遇到所谓的幻觉&#xff08;Hallucination&#xff09;问题。对于语言模型而言&#xff0c;当生成的文本语法正确流畅&#xff0c;但与原文不符&#xff08;Faithfulness&#xff09;或事实不符&#xff08;Factualness&a…

Ubuntu 22.04安装cuda及Pytorch教程

文章目录 1、安装显卡驱动2、安装CUDA3、安装cuDNN4、安装pyTorch5、卸载CUDA参考资料 服务器重装系统后&#xff0c;需要重新安装显卡驱动、cuda及Pytorch等&#xff0c;有些步骤容易忘记&#xff0c;这里记录一下。这里我的服务器配置以及安装版本的情况如下&#xff1a; 服…

基于简单Agent对医疗数据进行分析

数据表 供应商资格审核规定.pdf 医生名录.xlsx 历史就诊记录.xlsx 患者信息名录.xlsx 药品.xlsx 药品库存管理.xlsx 采购单位基本信息.xlsx Agent测试 模型基于ChatGPT-3.5 问题&#xff1a;帮我找出不达标的供应商 Agent分析过程 [Thought: 0] Key Concepts: - 不达标的供…

IMX6ULL kernel移植

1.环境说明 编译主机Debian 12交叉编译工具arm-none-linux-gnueabihf-gcc(gcc version 12.3.1 20230626)kernel版本lf-6.6.3-1.0.02.官方默认版本说明 默认官方版本的kernel是可以运行的,直接按照下面的命令编译即可 ###清除掉默认配置make ARCH=arm CROSS_COMPILE=arm-no…

【每日刷题】Day58

【每日刷题】Day58 &#x1f955;个人主页&#xff1a;开敲&#x1f349; &#x1f525;所属专栏&#xff1a;每日刷题&#x1f34d; &#x1f33c;文章目录&#x1f33c;​​​​​​​ 1. 3038. 相同分数的最大操作数目 I - 力扣&#xff08;LeetCode&#xff09; 2. 868. …

男士内裤怎么选?五款不能错过的超舒适男士内裤

在快节奏的现代都市生活中&#xff0c;男士们同样需要关注内在穿搭的品质与舒适度。一条优质贴身的男士内裤&#xff0c;不仅是日常穿着的舒适保障&#xff0c;更是展现男性精致品味的秘密武器。今天&#xff0c;就让我们一同探讨如何挑选出最适合自己的男士内裤&#xff0c;并…

从云端到终端:青犀视频汇聚/融合平台的视频接入方式与场景应用

一、青犀视频汇聚/融合平台 由TSINGSEE青犀视频研发的EasyCVR智能融合/视频汇聚平台基于“云-边-端”一体化架构&#xff0c;支持视频汇聚、融合管理&#xff0c;兼容多协议&#xff08;GA/T1400/GB28181/Onvif/RTSP/RTMP/海康SDK/Ehome/大华SDK/宇视SDK等&#xff09;、多类型…

数据结构——哈希表、哈希桶

哈希概念 顺序结构以及平衡树中&#xff0c;元素关键码与其存储位置之间没有对应的关系&#xff0c;因此在查找一个元素时&#xff0c;必须要经过关键码的多次比较&#xff0c;顺序查找时间复杂度为O(N),平衡树中为树的高度,即O(logN),搜索的效率取决于搜索过程种元素的比较次…

新能源集成灶怎么样?不需要燃料就能生火,是真的吗?

在当今的厨房电器领域&#xff0c;集成灶的出现引起了不少网友的广泛关注。这不&#xff0c;就在刚刚人民日报发布的一篇名为《中国新能源产业发展是全球性贡献和机遇》报道中提到&#xff1a;中国新能源产品销量突破万亿大关&#xff0c;中国新能源技术全球领先。从这样一份亮…

windows10系统下替换、修改jar中的文件并重新打包成jar文件然后运行

1、问题来源 maven打包部署之后发现页面上内容显示不正确&#xff0c;究其原因发现是打包之后activiti内某些文件内容错误所致&#xff0c;故想到临时解决方案&#xff1a;先打包完&#xff0c;再修改jar中的activiti文件&#xff0c;再重新打包 2、操作步骤 2.1、解压jar包 …

【Test 58】 Qt信号与槽机制! 高频的Qt 知识点!

文章目录 1.Qt 信号与槽机制原理&#xff08;Signal & Slot&#xff09;2. QObject 类 connect 的介绍3. 信号与槽机制连接方式4. 信号和槽机制优势及其效率&#xff1a;5. 信号与槽机制应用 1.Qt 信号与槽机制原理&#xff08;Signal & Slot&#xff09; &#x1f42…

个人vsCode配置文件<setting.js>

个人vsCode配置文件setting.js 快速打开1、使用快捷键 CtrlShiftP &#xff0c;然后搜索setting2、手动 自用配置 快速打开 1、使用快捷键 CtrlShiftP &#xff0c;然后搜索setting 2、手动 自用配置 {"terminal.integrated.profiles.windows": {"PowerShell&…

Spring的Controller是单例还是多例,如何保证线程安全的。

目录 验证是否单例&#xff08;默认单例&#xff09; 多例测试 单例对象成员变量测试 多例对象成员变量测试 解决方案 结论&#xff1a; 补充说明 答案&#xff1a;controller默认是单例的&#xff0c;不要使用非静态的成员变量&#xff0c;否则会发生数据逻辑混乱。 正…

大数据之HDFS磁盘扩容(linux磁盘扩容)

之所以扩容,是因为当前大数据平台已经接入了不同来源的数据,当执行mapreduce任务时,会发生磁盘爆满,导致hdfs爆红 具体扩容方案如下: 1、查看云磁盘分区情况 fdisk -l . 可以从图看出&#xff1a; /dev/vda 数据盘磁盘容量为21.5GB&#xff0c;包含/dev/vda1分区 /dev/vdb 数…

2024 年最新商家转账到零钱功能申请问题集中解答

鉴于诸多商户在申请商家转账到零钱时受到过时、错误经验文章的误导&#xff0c;基于我们数千次成功开通商家转账到零钱功能的丰富经验&#xff0c;特整理此篇文章&#xff0c;以期对新商户开通微信支付的商家转账到零钱功能提供有益帮助。以下将针对商家转账到零钱功能申请前、…

乐高小人分类项目

数据来源 LEGO Minifigures | Kaggle 建立文件目录 BASE_DIR lego/star-wars-images/ names [YODA, LUKE SKYWALKER, R2-D2, MACE WINDU, GENERAL GRIEVOUS ] tf.random.set_seed(1)# Read information about dataset if not os.path.isdir(BASE_DIR train/):for name in …

JDK7 JDK8 JDK9接口中的默认方法、静态方法、私有方法

JDK8开始之后接口新增的方法 JDK7以前&#xff1a;接口中只能定义抽象方法 JDK8的新特性&#xff1a;接口中可以定义有方法体的方法&#xff08;默认、静态&#xff09; JDK9的新特性&#xff1a;接口中可以定义私有方法 接口中的默认方法InterA package com.itheima.a06;p…