(一)前言
当我们要做网页动画时候,不管是css还是js控制,其实在复杂连续动画下,都很难保证连续和流畅性,那么,我们就需要一个能给出的简单的解决方案,正好,TweenMax.js 就能解决这件事
(二)TweenMax初探
官方文档地址
github
// 安装依赖
$ npm i gsap
// or
$ yarn add gsap
GreenSock目前提供使用的有「TweenLite」、「TweenMax」、「TimelineLite」、「TimelineMax」这四个项目
TweenMax就是GSAP的”全家桶”, 包含了TweenLite, TimelineLite, TimelineMax, CSSPlugin, AttrPlugin, RoundPropsPlugin, DirectionalRotationPlugin, BezierPlugin 和 EasePack.
我们介绍下TimelineMax使用
<("#obj", 0.5, {left:200}); // to 对象的操作方法 // '#obj' 指定动画 // 0.5 持续实际 // {left:200} css 属性
为了方便演示,我直接使用cdn地址
<script src=".1.3/T
本文发布于:2024-01-28 04:29:05,感谢您对本站的认可!
本文链接:https://www.4u4v.net/it/17063873494779.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
留言与评论(共有 0 条评论) |