鼠标悬停阴影的效果被旁边div挡住的解决办法

出现的问题

需求要求鼠标悬停某个图片上有阴影效果,但阴影被旁边相邻的div挡住了,如图所示

解决方案

给悬停的这块div增加2个css属性

bash 复制代码
$(this).css('position', 'relative');
$(this).css('z-index', '200');

新的效果如图所示

一直写后端,前端的都忘了,记录一下。

注意:如果谷歌浏览器,edge等没阴影效果,那大概率是没有考虑到兼容性,可以加

bash 复制代码
    -moz-box-shadow: 3px 3px 4px #000;

    -webkit-box-shadow: 3px 3px 4px #000;

    box-shadow: 3px 3px 4px #000;
相关推荐
下位子3 分钟前
『AI 编程』用 Claude Code 从零到一开发全栈减脂追踪应用
前端·ai编程·claude
tyro曹仓舒3 分钟前
Vue单文件组件到底需不需要写name
前端·vue.js
用户47949283569153 分钟前
面试官:讲讲2FA 双因素认证原理
前端·后端·安全
乐影4 分钟前
TS 模板字符串类型:从基础到进阶的类型编程魔法
前端·typescript
龙在天5 分钟前
CSS 属性值的计算与过程
前端
云鹤_6 分钟前
【Amis源码阅读】组件注册方法远比预想的多!
前端·低代码
xinfei8 分钟前
ES6 新特性 从 ECMAScript 2015(ES6)到 ECMAScript 2025
前端
GBVFtou10 分钟前
vue响应式 track 和trigger 过程
前端
耀耀切克闹灬18 分钟前
生成tag号的脚本
前端
Never_Satisfied22 分钟前
在JavaScript / HTML中,line-height是一个CSS属性
javascript·css·html