鼠标悬停阴影的效果被旁边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;
相关推荐
是你的小橘呀5 小时前
深入理解 JavaScript 预编译:从原理到实践
前端·javascript
uhakadotcom5 小时前
在使用cloudflare workers时,假如有几十个请求,如何去控制并发?
前端·面试·架构
风止何安啊5 小时前
栈与堆的精妙舞剧:JavaScript 数据类型深度解析
前端·javascript
用户47949283569155 小时前
Chrome DevTools MCP:让 AI 助手直接操作浏览器开发工具
前端·javascript·chrome
Rysxt_5 小时前
Vuex 教程 从入门到实践
前端·javascript·vue.js
by__csdn6 小时前
Node.js版本与npm版本的对应关系
前端·npm·node.js
AI_56786 小时前
Webpack性能优化终极指南:4步实现闪电打包
前端·webpack·性能优化
威风的虫6 小时前
ES6 数组方法:告别循环,拥抱函数式编程
开发语言·前端·javascript
小杨快跑~6 小时前
ES6 Promise:告别回调地狱的异步编程革命
前端·javascript·ecmascript·es6
linweidong7 小时前
VIVO前端面试题及参考答案
前端·跨域·localstorage·重绘·浏览器兼容·git管理·前端重构