easyui—window在vue-element-ui中的使用(坑)
自己给自己挖的坑 !!!
项目中,布局外层使用easyui框架中的window;内部显示内容的table使用element-ui框架,需求将window使用border-image作为边框,之后发现拉动窗口改变大小时鼠标作用不是特别灵敏,于是想要优化:
百度一圈发现博友建议使用定位来扩大鼠标的作用域;具体思路大致如下
table{
position:relative;
&::before{
content: '';
position: absolute;
top: -10px; right: -10px;
bottom: -10px; left: -10px;
}
}
使用该方法后不但没有达到想要的效果还出现了难以想象的后遗症:
查找了好久才发现人家原本的定位使用的是绝对定位,即窗口打开后就是在定义好的top和left对应的地方,而改成相对定位后是相对于本身来定位,top设置的n,则真正的top为本身高度h+n,不仅如此,同时打开两个window窗口时,第二个起总是一次往下排列,且只要拖动窗口,窗口就会往下掉。。。
城门失火殃及池鱼,表格下方的分页也成为受害者, 设置了上下左右四个方位的值后,el-pager(页码数)处于被凝固的状态,点不动,一开始以为是表格的层级太高将翻页遮住了,结果不是,就是上面伪类的锅。
经此一事,我才恍然大悟,不要随意更改原框架元素的定位,否则追悔莫及
本文来自博客园,作者:小虾米吖~,转载请注明原文链接:https://www.cnblogs.com/LindaBlog/p/10930778.html
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· DeepSeek 开源周回顾「GitHub 热点速览」