当前位置：首页 > news >正文

web网站建设与计划论文近期国内新闻热点事件

news 2025/7/31 11:57:24

web网站建设与计划论文,近期国内新闻热点事件,化妆品网站开发背景,wordpress和ucenter效果图: 一. 表格结合返回顶部二. 局部loading 解决方法: 一返回顶部 target绑定滚动dom的父元素类名就可以了. 1.如果你的表格是固定表头的,那滚动dom的父元素类名就是 el-table__body-wrapper <el-backtop target".el-table__body-wrapper" :visibility…

请添加图片描述
效果图:

一. 表格结合返回顶部

请添加图片描述

二. 局部loading

解决方法:

一返回顶部

target绑定滚动dom的父元素类名就可以了.

1.如果你的表格是固定表头的,那滚动dom的父元素类名就是 el-table__body-wrapper

  <el-backtop target=".el-table__body-wrapper" :visibility-height="100" :bottom="75"><divstyle="{height: 100%;background-color: #1989fa;border-radius: 50%;box-shadow: rgb(16 0 0 / 41%) 0px 12px 6px 0px;text-align: center;line-height: 40px;color: #fff;width: 100%;}"><i class="el-icon-top"></i></div></el-backtop>

如图:
在这里插入图片描述

2.如果你的表格不是固定表头,表头跟随内容一起滚动的,那滚动dom的父元素类名就是 el-table

如图:
在这里插入图片描述
可能父元素类名会有差别,只要是滚动dom的父元素就可以了

二局部loading

局部loading有时候会出现定位不准情况,会定位到全屏loading
如图:
请添加图片描述
可以看到首先是局部的loading,加载完后变成了全屏的loading

解决办法就是给举报loading的元素加一个相对定位就可以了

// js
const loading = this.$loading({lock: true,text: '拼命加载中......',spinner: 'el-icon-loading',background: 'rgba(0, 0, 0, 0.5)',target: document.querySelector('.about'),
})// css
.about {position: relative;
}