10 2023 档案

html+css3+anime.js实现线条来回滑动且渐隐动画
摘要：效果： 代码： <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta name="viewport" content="width=devic 阅读全文
posted @ 2023-10-19 10:58 芝麻小仙女 阅读(135) 评论(0) 推荐(0)
html+css3+anime.js实现文字故障动画
摘要：记录一个很酷的动画，效果如图： 是基于html+css3+anime.js实现的，看了眼代码，其实是默认文字的div中定位了几个相同的文字块，利用clip-path这个属性去裁剪展示其中的一部分，用于展示故障的效果，动画则是使用anime.js去循环改变X与Y轴的位置，同时调整绘制的颜色，demo代 阅读全文
posted @ 2023-10-19 10:08 芝麻小仙女 阅读(168) 评论(0) 推荐(0)
pc端自适应&&移动端rem适配代码
摘要：第一种 俺写在index.html中的head标签与body标签中间（2560是pc端设计稿的宽度）： <script> //设置 webview 字体大小不受系统修改而改变 (function () { if (window.HiSpaceObject) { window.HiSpaceObjec 阅读全文
posted @ 2023-10-13 09:26 芝麻小仙女 阅读(400) 评论(0) 推荐(1)
【vue2】实现css动效逐个顺序展示的效果（简陋版）
摘要：效果（进入预约里程碑模块后，小人从第一个台阶逐个闪烁出现在当前预约等级之前的台阶并消失，最终停留在当前预约等级的台阶上）： 虽然很low但是！就是这么设计的！于是在原本静态的代码上稍加了些修改（为什么，为什么，想问天问大地） 首先是台阶部分的代码： <div :class="$style.reser 阅读全文
posted @ 2023-10-12 17:57 芝麻小仙女 阅读(299) 评论(0) 推荐(0)
【vue2】实现长按图片保存功能
摘要：<span :class="[$style.wxCode, isShow && $style['show']]" @touchstart="touchStart()" @touchend="touchEnd()" ></span> ps.span元素为图片元素，我这里把图片设置为元素背景了，可以直接 阅读全文
posted @ 2023-10-08 16:47 芝麻小仙女 阅读(586) 评论(0) 推荐(0)