徜徉在知识海洋的一群鲸鱼
Vue3 动画实现
Vue3 动画实现

Vue3 动画实现

需求:完全还原样式,布局,动画,交互

样式与悬停效果

作品每次滑动一页,滑动动画结束后显示第一个元素与最左侧对齐

视频列表排序为时间排序

视频信息时长格式化为分秒

图片视频悬停查看效果

大小适配,间距不变,图片缩放效果为居中裁剪不拉伸,图片长宽比例保持不变

vue3 新建项目,选择 pnpm

报错:CERT_HAS_EXPIRED

解决:npm config set strict-ssl false

图片处理

像素转换

pnpm i postcss postcss-pxtorem -D