摘要：
效果如图 代码如下： background: linear-gradient( to bottom, #ffffff 0%, #ffffff 45%, #389df5 100% ); background-clip: text; -webkit-background-clip: text; -web 阅读全文
摘要：
//获取视频封面作为缩略图： captureVideoImage() { let videoArr = document.querySelectorAll('.swipe-video'); let _this = this; for (let i = 0; i < videoArr.length; 阅读全文
摘要：
el-table表头高亮动画效果 <div class="front-table"> <el-table :data="tableData" height="100%" stripe :header-cell-style="{ backgroundColor: 'transparent', colo 阅读全文
摘要：
效果如图： 核心：使用伪类 代码如下： <div class="box-style"></div> .box-style { position: relative; //纯css只有四个角有边框的样式 box-shadow: 0px 0px 12px 1px #003ba26b inset; bac 阅读全文
摘要：
效果如图： vue+css纯手写代码，首先是遍历和处理数据，如果数据给的好不用处理那可以省略处理这步。 0-9数字依次向上滚动两次，最终停留在要求的数字上。整了个信息差。 图上是三组数据，这里代码只放一组作为示例。需要做的准备：0-9和.的编号数字图片11张，再加背景图片一张。 组件代码： 父组件： 阅读全文
摘要：
效果如图：（背景图片自行替换） 这是用纯css写的电池样式，获取数据后，找出最大值，并计算长条的宽度，从而完成样式。 话不多说上代码： <!-- * @Description:电池样式组件 * @Author: 如意酱 * @Date: 2022-01-08 13:31:37 * @LastEdit 阅读全文
摘要：
参考链接：https://www.jq22.com/jquery-info24050 说明：此组件为渲染曲线图的卡片堆叠轮播图，可以渲染不止5个，数量自己决定。核心代码js文件在后面。个人感觉这个的过渡效果最自然，最丝滑~ 效果如图： html部分：（此代码用到了之前写的折线图组件，这里不再赘述了） 阅读全文
摘要：
el-tree 只要数据结构对就能直接用的组件 功能： 1.可新建最外层一级节点 2.可编辑删除每一级节点 3.可在每一级节点下新增子节点（添加下级） 4.可拖动排序，但只能平级拖动（为了防止拖动乱了的情况） 5.可搜索 6.初始化折叠状态，逐个打开编辑后，保持当前节点打开状态 效果如图： （附赠数 阅读全文
摘要：
样式如图 使用： <echartLine ref="day30Echat" :xAxis="timeList" :xlist="xlist30Day" :xlist2="xlist230Day" :smooth="true" ></echartLine> js方法： get30(area) { le 阅读全文
摘要：
参考链接：https://blog.csdn.net/weixin_42146585/article/details/121180829 首先得首先，先下载水波球插件依赖 npm install echarts-liquidfill 然后引用 import 'echarts-liquidfill' 阅读全文