动漫

　　第一步，插[url=http://www.2ppt.cn]金色的脚印课件[/url]入一张树叶图片将其放置于画布外，选中树叶，为其添加“陀螺旋”(此动画在“强调”组中)。双击动画窗格中的“陀螺旋”，为其设置参数，如下图所示。 　　第二步，选中树叶，单击工具栏的“添加动画”，为其添加“基本旋转”(此动画在“进入—华丽”组中)。双击动画窗格中的“基本旋转”，为其设置参数，效果选项卡采用默认的参数，计时选项卡与“陀螺旋”参数相同。 　　第三步，同样的方法为树叶添加“自定义路径”动画(此动画在“动作路径”组中)，画出树叶的运行轨迹，注意要超出画布的大小，这样树叶的飘落才会自然。然后为其设置参数，如下图。 　　最后一步，同样的方式制作出更多的叶子，调整它们路径，使其沿不同的轨迹飘落。调整叶子与叶子间的延时，使其有时差的飘落。 　　Ok，树叶飘落完成。 本文转自http://www.2ppt.cn/Article/291.html 来源： oschina 链接： https://my.oschina.net/u/2445063/blog/506842

Vue动画原理 增加和删除css增加样式实现一个过渡效果也就是动画效果 1.需要动画效果的标签外包裹一个transition标签 会被自动分析css样式，然后自动构建一个动画流程 transition标签中 name=“fade”如果不写默认v 1.动画即将执行的时候增加两个css fade-enter fade-enter-active 2.第一帧执行完毕。vue会增加一个css fade-enter-to 删除fade-enter 3.最后一帧，会去掉所有添加的css 上面是显示步骤 ，下面是隐藏步骤 来源： https://www.cnblogs.com/-constructor/p/11951244.html

遮罩动画作为PPT中独具一格的动画效果技巧，如果你善于使用遮罩动画，那么你的PPT的展现效果绝对很好。但是很多人不会使用遮罩动画效果，所以今天小编就在这里为大家介绍如何轻松制作遮罩动画效果。 一：遮罩动画 1：新建一张幻灯片，我们先【右击】设计幻灯片主题颜色，之后点击【插入】-【绘制文本框】，插入文字。 2：点击【形状】，选取【矩形】，在文本框中绘制一个足以覆盖文字的矩形框。将文本框颜色调节与主题一致，轮廓调节为无轮廓。 3：选取矩形，点击设置动画效果，将动作路径设置为【直线】，效果选项选择【向右】，设置动画持续时间，这样最简单的遮罩动画就完成了。 二：遮罩视频 1：点击【插入】，在【形状】中选取矩形形状，在幻灯片中绘制出一个色块版面。右击幻灯片，在填充中可调整主题颜色。之后绘制一个横排文本框，输入文字，调节好文字的大小和尺寸 2：先点击色块版面，按住【shift】键同时点击文本框，点击【绘图工具-格式】，在【合并形状】中选择【剪除】可以制作镂空效果。 3：在幻灯片中插入视频，右击视频选择【置于底层】，这样镂空视频就制作好了。 4：选取遮罩色块，点击【动画效果】，找到【更多进入效果】，选择【基本缩放】，然后在【效果选项】中选择缩小。之后再动画窗格中将遮罩动画的播放顺序移动到视频播放的上面，这样一个遮罩动画视频就完成了。 PPT中如何制作遮罩动画效果

https://www.gcssloop.com/customview/Path_Over 来源： https://www.cnblogs.com/acg88688/p/11934751.html

过渡和动画 　　使用<transition> 组件包裹 　　例：　　<transition name="fade"> 　　　　　　　　<div v-if="true">过渡动画</div> 　　　　　　</transition> 　　style：.fade-enter-active, .fade-leave-active {transition: opactiy .5s} 　　　　　.fade-enter, .fade-leave-to{opacity:0;} 　　以上切换v-if的状态能够让div元素渐显渐隐，而不是直接添加删除 　　原理是VUE通过tansition组件的name属性值，然后使用它在过渡的各个节点为包含的元素添加类名。当元素被添加到文档或者从文档中移除时，会分别应用enter和leave两类过渡。以下是会添加的类名： 　　　　{name}-enter（常用）:这个类名会在元素被插入DOM时加入，然后在下一帧立刻移除。可以使用它来设置那些需要在元素开始进入过渡时移除的CSS属性。 　　　　{name}-enter-active（常用）: 在元素整个动画阶段应用。和-enter 同时被添加，然后在动画完成时被移除。适用于设置css过渡时间长度，过渡的属性和使用的曲线函数。 　　　　{name}-enter-to: 这个类名会在

jQuery 动画 - animate() 方法 jQuery animate() 方法用于创建自定义动画。 $( selector ).animate({ params } ,speed,callback ); 必需的 params 参数定义形成动画的 CSS 属性。 实例： $ ( " button " ) . click ( function ( ) { 　　$ ( " div " ) . animate ( { left : ' 250px ' } ) ; } ) ; 注：点击按钮，div元素向右移动250px 使用相对值 也可以定义相对值（该值相对于元素的当前值）。需要在值的前面加上 += 或 -=： $ ( " button " ) . click ( function ( ) { 　　$ ( " div " ) . animate ( { 　　　　 left : ' 250px ' , 　　　　 height : ' +=150px ' , 　　　　 width : ' +=150px ' 　　 } ) ; } ) ; 使用预定义的值 您甚至可以把属性的动画值设置为 "show"、"hide" 或 "toggle"： 注：这样设置的效果为元素上下滑动至隐藏或显示。 来源： https://www.cnblogs.com/1016391912pm/p/11923037

来源： https://www.cnblogs.com/CourserLi/p/11912438.html

线上看： https://lihi1.com/kOx5y 来源： https://www.cnblogs.com/mimimei/p/11905404.html

## 安装react-transition-group ## npm install react-transition-group --save 或者 npm i react-transition-group -S ## 使用react-transition-group## react-transition-group有三类动画库： Transition CSSTransition TransitionGroup 例子引入CSSTransition动画库： import {CSSTransition} from 'react-transition-group' ##使用案例## <CSSTransition in={this.state.isShow} //用于判断是否出现的状态 timeout={2000} //动画持续时间 classNames="animation" //className值，防止重复 unmountOnExit // 退出动画事，删除DOM > <div>动画展示区</div> </CSSTransition>CSS常用特效： xxx-enter: 进入（入场）前的CSS样式； xxx-enter-active:进入动画直到完成时之前的CSS样式; xxx-enter-done:进入完成时的CSS样式; xxx-exit:退出（出场）前的CSS样式; xxx

普通 .wise-loading { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 70px; height: 70px; color: #3288ff; animation: wise-loading 0.6s linear 0s infinite alternate; /* name 周期花费时间 开始时间 动画次数 轮流反向播放*/ } @keyframes wise-loading { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } 立方贝塞尔曲线 0.3s cubic-bezier(0.25, 0.8, 0.5, 1) 来源： https://www.cnblogs.com/smzd/p/11888433.html