zoukankan      html  css  js  c++  java
  • 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(页码数)处于被凝固的状态,点不动,一开始以为是表格的层级太高将翻页遮住了,结果不是,就是上面伪类的锅。

    经此一事,我才恍然大悟,不要随意更改原框架元素的定位,否则追悔莫及 

    没有人能一路单纯到底,但是要记住,别忘了最初的自己!
  • 相关阅读:
    前端--页面提交重置功能
    ztree获取当前选中节点子节点id集合的方法(转载)
    sqlserver锁表、解锁、查看销表 (转载)
    解决前端文件修改后浏览器页面未更新的问题
    简单的上传文件
    如何在Eclipse中查看JDK以及JAVA框架的源码(转载)
    设计模式--观察者模式
    WebService 学习
    学习quartz定时
    JS 中AJAX,Fetch,Axios关系
  • 原文地址:https://www.cnblogs.com/LindaBlog/p/10930778.html
Copyright © 2011-2022 走看看