avatar
文章
2109
标签
34
分类
0
首頁
目录
标签
友鏈
关于
Logo阿超animejs示例 返回首页
搜索
首頁
目录
标签
友鏈
关于

animejs示例

发表于2025-02-17|更新于2026-02-24
|浏览量:

读书使人充实,思考使人深邃,交谈使人清醒。——富兰克林

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

等等

前端
上一篇
scopedb官网首页
我来到这个世界,为了看看太阳和蓝色的地平线。——《城门开》 https://github.com/scopedb/scopedb-site/pull/32 最近忙着给scopedb做了一个最简单的官网首页 这里说到一些细节吧,首先是适配移动端或者说小尺寸屏幕,这里在没有移动端对应UI设计图的情况下,我们采取pc的布局,因此字体单位使用的vw 然后是这张图片,未来可能会改为带动画的,效果会比较惊艳和抢眼 首页tsx如下 123456789101112131415161718192021222324252627282930313233343536373839import React from "react";import styles from './index.module.css';import Layout from "@theme/Layout";import clsx from "clsx";function HomepageBanner(): React.JSX.Element ...
下一篇
animejs
万人都要将火熄灭,我一人独将此火高高举起。——海子 https://github.com/juliangarnier/anime https://animejs.com/ Anime.js:为网页动画注入生命 在现代网页开发中,动画不再仅仅是装饰性的元素,而是增强用户体验、提升交互性的关键部分。Anime.js,一个轻量级的 JavaScript 动画库,提供了一个易于使用的接口来创建复杂的动画效果。它不仅让开发者能够轻松制作视觉冲击力强的动画,还能确保这些动画在各大浏览器中的兼容性,完美融合到现代网页设计中。 什么是 Anime.js?Anime.js 是一个功能强大的 JavaScript 动画库,它能够为 HTML、CSS、SVG、JavaScript 对象等提供平滑、流畅的动画效果。不同于许多其他动画库,Anime.js 不仅支持基本的动画(如平移、旋转、缩放等),还支持更为复杂的时间线和属性控制,让动画的表现更加生动和灵活。 特性和优势 多种动画支持:Anime.js 不仅可以控制 DOM 元素的 CSS 属性,还可以操作 SVG 属性、JavaScript 对象的...
相关推荐
2024-12-16
EqualUI
文人灵魂深处必须是一个野蛮人。——芥川龙之介 https://equal-ui.github.io/Equal/ https://github.com/Equal-UI/Equal Equal-UI:构建现代Vue 3应用的UI组件库 在开发现代Web应用时,一个简洁易用的UI组件库能够显著提升开发效率和用户体验。而Equal-UI正是一款专为Vue 3设计的现代化UI组件库,提供了丰富的组件和优雅的设计,帮助开发者快速构建高质量的用户界面。 什么是Equal-UI?Equal-UI是一款基于Vue 3和TypeScript开发的开源UI组件库。它专注于提供轻量级、性能优越且可高度自定义的组件,适用于各种现代Web应用场景。 核心特性 Vue 3支持:专为Vue 3优化,充分利用Composition API和其他新特性。 现代化设计:组件风格简洁优雅,遵循现代UI设计原则。 高度可定制:支持主题定制,开发者可以轻松调整组件外观以满足需求。 无依赖:尽量减少对第三方库的依赖,确保轻量级和高性能。 TypeScript支持:提供完善的类型定义,提升开发体验和代码质量。 快速开...
2024-09-18
vue2使用vite过渡
君子藏器与身,待时而动。——佚名 项目介绍 vite-plugin-vue2 是一个 Vite 插件,专门用于在 Vite 项目中支持 Vue 2。Vite 是一个基于 ES Module 的现代构建工具,它以极速启动、模块热替换(HMR)和极快的构建速度而闻名。然而,Vite 最初只支持 Vue 3,而 vite-plugin-vue2 插件使得开发者能够在不升级到 Vue 3 的情况下,继续享受 Vite 的高效开发体验。 通过这个插件,开发者可以在 Vue 2 项目中体验到 Vite 的快速启动、热重载和高效打包,而无需迁移到 Vue 3。这为那些已经深度使用 Vue 2 的项目提供了极大的便利。 主要特点: Vue 2 支持:在 Vite 项目中使用 Vue 2,无需进行复杂的配置或迁移。 现代开发体验:支持 Vite 的快速启动、热模块替换(HMR)、高效的编译和打包。 兼容性:与现有的 Vue 2 项目无缝集成,不影响现有代码库的运行。 GitHub地址 GitHub 仓库:vitejs/vite-plugin-vue2 官方文档提供了详...
2022-02-25
photopea
我明知生命是什么,是时时刻刻不知如何是好,所以听凭风里飘来花香泛滥的街,习惯于眺望命题模糊的塔,在一顶小伞下大声讽评雨中的战场。——木心 分享一款在线ps的网站:https://www.photopea.com/ 非常方便~
2022-02-05
标签模板
不慕古,不留今,与时变,与俗化。——《管子·正世》 按照阮一峰ES6入门中写到的 我们可以使用函数名+模板字符串写法来调用函数,例如: 定义这样一个函数 123function templateFun(arguments){ return `Hello ${arguments[0]}!`} 这里简单用模板字符串,返回Hello +参数数组第一项元素+! 我们普通调用写法: 1templateFun(['Ruben']) 输出'Hello Ruben!' 我们如果使用标签模板,写法如下: 1templateFun`Ruben` 如果其中有变量,则会进行剥离拆分,我们对函数稍加修改,参数改为可变参数 12345function templateFun(...arguments){ console.log(arguments) return `Hello ${arguments}!`}templateFun`Ruben${'...
2022-10-30
designMode
保持友谊的最好办法是不出卖朋友——米兹涅尔 我们可以使用 1document.designMode = 'on' 来开启页面的编辑模式 例如:
2025-08-01
x6
人们宁愿去关心一个蹩脚电影演员的吃喝拉撒和鸡毛蒜皮,而不愿了解一个普通人波涛汹涌的内心世界。——路遥《平凡的世界》 X6 :让你的流程图、DAG、ER图开发像搭积木一样高效有趣!如果你是一名开发者、产品经理,或者数据分析师,是否曾为“如何快速搭建一个好用、美观、可定制的流程图/DAG/ER图编辑器”而头疼?AntV X6,就是为了解决你的痛点而生的专业图编辑引擎! X6是什么?X6 是 AntV 旗下的图编辑引擎,专为流程图、DAG 图、ER 图等各类图应用打造。它提供了简单易用的节点定制能力和丰富的交互组件,让你像搭积木一样快速实现强大、个性化的图应用,无论你是用 SVG、HTML、React、Vue 还是 Angular,都能轻松上手定制。官网直达:https://x6.antv.antgroup.com 四大核心特性,让图编辑开发变得“丝滑”!🌱 极易定制 支持 SVG/HTML/React/Vue/Angular 各种主流技术栈,无论你喜欢哪种方式,都能打造出炫酷的节点样式和交互效果。 节点、边都能灵活...
avatar
阿超
我的名字叫阿超 年龄25岁 家在北京市 职业是软件开发 每天最晚也会在八点前回家 不抽烟 酒浅尝辄止 晚上十二点上床 保证睡足八个小时 睡前写一篇博客 再做二十分钟俯卧撑暖身 然后再睡觉 基本能熟睡到天亮 像婴儿一样不留下任何疲劳和压力 就这样迎来第二天的早晨 健康检查结果也显示我很正常 我想说明我是一个不论何时都追求内心平稳的人 不拘泥于胜负 不纠结于烦恼 不树立使我夜不能寐的敌人 这就是我在这社会的生活态度
文章
2109
标签
34
分类
0
Follow Me
公告
This is my Blog
最新文章
hve-core2026-03-07
AReaL2026-03-06
ruflo2026-03-05
prompt-eng-interactive-tutorial2026-03-04
airi2026-03-03
© 2025 - 2026 By 阿超框架 Hexo 8.1.1|主题 Butterfly 5.5.4
搜索
数据加载中