animejs示例
发表于|更新于
|浏览量:
读书使人充实,思考使人深邃,交谈使人清醒。——富兰克林
https://codepen.io/collection/XLebem/
这里有anime.js实现的不少案例
例如移动端的卡片弹出动画实现:
https://codepen.io/aryankap/pen/poERmEM
带进度条的提交按钮:
https://codepen.io/andrewmillen/pen/MoKLob
带动画的小图标:
https://codepen.io/nat-davydova/details/dyorEMm
夜间模式切换按钮:
https://codepen.io/borntofrappe/details/aboPapm
等等
相关推荐
2022-10-30
designMode
保持友谊的最好办法是不出卖朋友——米兹涅尔 我们可以使用 1document.designMode = 'on' 来开启页面的编辑模式 例如:
2022-08-31
资源路径与blobUrl互转
害怕树敌的人永远得不到真正的朋友——哈兹里特 首先是普通资源URL转换为blobUrl 12345678910111213// 生成blobURLconst xhr = new XMLHttpRequest();xhr.open('GET', 'https://VampireAchao.github.io/imgs/preview/3356_3.jpg', true);xhr.responseType = 'blob';xhr.onload = function (e) { if (this.status == 200) { var blob = this.response; console.log(blob); // document.getElementById("myImg").src = URL.createObjectURL(blob); console.log(URL.createObjectURL(bl...
2025-04-13
nuxt
忘记了它而微笑,远胜于记住它而愁苦。——罗西塔 Nuxt.js:构建现代 Web 应用的强大框架Nuxt.js 是一个基于 Vue.js 的开源框架,旨在简化开发现代 Web 应用的工作流程。无论是服务端渲染 (SSR)、静态网站生成 (SSG),还是单页应用 (SPA),Nuxt.js 都提供了一套强大而灵活的解决方案。 背景与简介Nuxt.js 起源于 2016 年,由 Sebastien Chopin 和 Alexandre Chopin 创立。它的初衷是为 Vue.js 应用提供一套开箱即用的工具链,帮助开发者快速构建高性能、SEO 优化以及用户体验卓越的 Web 应用。 今天,Nuxt.js 已发展成为 Vue.js 生态中不可或缺的一部分,被广泛用于企业级和开源项目中。 核心特点1. 服务端渲染 (SSR)Nuxt.js 提供了简单且高效的服务端渲染功能。这不仅提升了应用的加载速度,还显著优化了 SEO 表现。 2. 静态站点生成 (SSG)通过 Nuxt.js 的 nuxt generate 功能,你可以轻松生成静态 HTML 文件,从而创建完全静态化的网站...
2024-07-26
使用Console Importer安装lodash并使用
健康和才智是人生两大幸事。——米南德 我今天在逛lodash官方文档,用Console Importer仅需安装时 除了我们一般的使用方式也就是$i("lodash") 12345678$i("lodash")importer.js:2 [$i]: Searching for lodash, please be patient...undefinedimporter.js:2 [$i]: lodash not found, import lodash.js instead.importer.js:2 [$i]: lodash.js is loading, please be patient...importer.js:2 [$i]: lodash.js(https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js) is loaded._.camelCase('Foo Bar');'fooBar' 还可以直接Vue ...
2022-12-27
hexo主题集成pug
你问人问题,她若答非所问,便已是答了,无需再问。——木心 文档:https://hexo.io/zh-cn/docs/themes 先创建hexo项目 1hexo init simple-hexo 然后到themes新建一个主题文件夹 12cd .\simple-hexo\themes\mkdir simple-theme 修改外部_config.yml的theme 1theme: simple-theme 外部执行一下hexo s启动项目试试 打开localhost:4000 因为我们什么都没写,所以是白屏 新建一个layout目录,下面放一个index.pug 1.container Hello World 发现我们的pug代码并未渲染 这是因为我们没有安装pug插件导致的 到主目录执行 1cnpm i hexo-renderer-pug pug元素成功渲染 好了,接下来你可以编写你自己的主题啦!
2022-01-11
uniapp对接oss视频上传+压缩
与其在绝望和挣扎中苟活,不如在希冀和盼望中死亡。——纪伯伦 首先是文件上传的代码: 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899module.exports = { getUUID() { //生成UUID return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, c => { return (c === 'x' ? (Math.random() * 16 | 0) : ('r&0x3' | '0x8')).toString(16) }) &...

阿超
我的名字叫阿超 年龄25岁 家在北京市 职业是软件开发 每天最晚也会在八点前回家 不抽烟 酒浅尝辄止 晚上十二点上床 保证睡足八个小时 睡前写一篇博客 再做二十分钟俯卧撑暖身 然后再睡觉 基本能熟睡到天亮 像婴儿一样不留下任何疲劳和压力 就这样迎来第二天的早晨 健康检查结果也显示我很正常 我想说明我是一个不论何时都追求内心平稳的人 不拘泥于胜负 不纠结于烦恼 不树立使我夜不能寐的敌人 这就是我在这社会的生活态度
Follow Me公告
This is my Blog