css
文章平均质量分 64
Billy Feng
尽可能每天更新自己的播客,相信积累的过程就是复利的过程,加油,billy!!!!
展开
-
教你如何用VUE实现一个无缝横向滚动抽奖的效果
为了实现横向无缝滚动奖品,作者提前放了多组重复奖品列表,比如原先奖品列表有10个奖品,我们可以放置多几组重复奖品列表,所以奖品的数量(10 * n),为了效果更逼真,如果动画时间长的话,可以适当再加几组,让效果更加逼真。,那么我们点击滚动的时候,为了动画效果,自然要从第一组滚到最后一组,如我们要抽中第一个奖品,即第一组第一个奖品要滚到最后一组的第一个奖品,而且最后一组第一个奖品要在中间位置,我们可以计算好这个距离,这个距离怎么计算呢?我们可以看到停止时,第一个奖品的左边的奖品消失了,为什么呢?原创 2024-05-08 15:32:14 · 1712 阅读 · 2 评论 -
iview表格中设置resizable为true之后产生一些问题
目前项目所有表格全部都要设成可许拖拽调整宽度的,文档如下:需要每一列设置width固定宽度才能生效,这样就产生一个问题,如下:屏幕一长,最后一列就出现额外的空白,这时我们会说可以把最后一列width设成自适应,即“auto”不就解决了?但是这样又遇到另外个问题:如下 就是屏幕一缩小,表格样式就会发生错乱(不知道是不是iview的bug),所以当iview表格中设置resizable为true时,最后一列要设成固定宽度,但这面临一个问题,就是屏幕变得再大的时候,最后一列还是留有空白,所以这还是无法解原创 2022-03-30 20:28:32 · 1403 阅读 · 0 评论 -
iview的表头如何随着页面滚动可以固定住(关于position: sticky的一些新理解)
今天需要实现这样一个需求:在表格往下拖动的时候,需要固定表头整体思路:自己用iview写的,当时自己想得是这个表头用绝对定位,根据页面滚动的距离从而计算出定位数值,但是这样有个问题,就是当数据多的时候,很快去滚动页面的话,这个表头会出现抖动的状态,应该计算定位px数值的时候耗了点时间,当时自己参照别人网站的时候,发现别人用的是position: sticky,自己当时也百度去搜了position: sticky的用法,发现有点乱,所以自己用google搜了下MDN文档,从而看到一个比较系统的说法:上面原创 2022-03-29 20:30:08 · 1819 阅读 · 1 评论 -
对于height :100%的理解
最近在做项目的时候,在调样式的时候,给一个元素的样式设为height:100%,发现没有达到效果,最后发现给他的父元素设了高度之后就有反应了。难道这样就解决了?还没有,我还要去查一查!搜了w3cschool的文档,看到这个:这样才明白了一点,难道是width也是这样?嗯嗯,好像都是差不多的意思,那他们有什么区别呢?如果一个元素给它设为height:100%,width:100%,它父元素什么都没设的话,那么起作用就只有width:100%,借鉴下来自于一位大神的一句话:上面的缺省值就是默认值原创 2020-06-26 11:00:41 · 2378 阅读 · 0 评论