动画

作者: 阿朝狠酷 | 来源:发表于2019-01-15 20:04 被阅读0次

CSS过渡动画:

transition:width 3s ease,height 3s ease 1s,background-color 3s ease 2s; 宽先变,用时3s,高1s后变,颜色2s后变
圆角:
border-radius:1s ease 3s;
transition:all 3s ease;一起变
运动曲线:
div:nth-child(1) 第一个div
box-shadow:左右,垂直,阴影清楚与否,阴影大小
insert 内阴影
transition:all 1s linear:匀速
transition:all ls ease; 中间快
transition:all 1s ease-in;越来快,突然停
transition:all 1s ease-out;越来慢,慢慢停
transition:all 1s ease-in-out;同ease
贝塞尔曲线:回弹
display:none;默认隐藏
display:block;出现
变形:
transform:translate(30px,20px); 水平,垂直位移 不影响别的
旋转:
transform:rotate(30deg) 转30度
transform:scale(0.5,3) 缩放
transform:skew(30deg,0) 水平斜切45度,垂直不变
transform-style:preserve-3d;
默认Z轴旋转
transform:perspective(800px) rotateX(45deg) X轴旋转
变形中心点:
transition-origin:left center; 沿着左边中心点转
transition-origin:left top; 左上角
transition-origin:50px 50px;
transition:all 1s ease;
transform:rotate(90deg);

背面可见:(默认)

transition:all 1s ease;
transform-style:preserve-3d;
transform:perspective(800px) rotateY(0deg);
transform-visibility:hidden; 背面不可见
transition:rotateY(180deg); 翻转
position:relative; 相对定位 父类定义,相对body
position:absolute; 绝对定位 相对父类
text-align:center; 文字居中
animation动画:
animation:moving 1s ease 1s 5(infinite) alternate forwards; 一次1s,5次(不限次),原路返回 ,停后不跳回
animation-play-state:paused; 鼠标移入暂停
running; 移入开动
@keyframes moving{
from{
width:100px;
}
to{
width:50px;
}
}
border-radius:50px; 圆

相关文章

  • Android回顾--(十六) 动画简析

    动画: 补间动画(Tween动画) 帧动画(Frame动画) 属性动画(Property动画) 补间动画 特点: ...

  • 在山西太原,做个二维动画需要哪些制作流程?

    二维动画有哪些类型? flash动画,课件动画,mg动画,ae动画,GIF动画,手绘动画,网页动画,企业动画,宣传...

  • Android 动画

    【Android 动画】 动画分类补间动画(Tween动画)帧动画(Frame 动画)属性动画(Property ...

  • 动画学习

    动画 分为 组动画,属性动画,渐变动画,其中属性动画包括 普通动画和关键帧动画,其他动弹动画,动画层分为 pres...

  • Android动画

    Android动画分类: 视图动画:补间动画、逐帧动画 属性动画 视图动画 补间动画 可以在xml中定义动画,然后...

  • iOS动画

    iOS动画-从UIView动画说起iOS动画-Transform和KeyFrame动画iOS动画-layout动画...

  • Android动画之视图动画

    分类 Android动画主要包括视图动画和属性动画。视图动画包括Tween动画和Frame动画。Tween动画又包...

  • Android 动画

    android动画分为三种 帧动画,视图动画(补间动画),属性动画逐帧动画 视图动画 属性动画 Window和A...

  • android动画

    动画: 分类:分为视图动画和属性动画,其中视图动画又分为补间动画和逐帧动画。补间动画又分为平移动画、缩放动画、旋转...

  • Android中的动画概述

    动画可以分为三类:View动画,帧动画,属性动画。 一、View动画 1.View动画包括四种:平移动画,缩放动画...

网友评论

      本文标题:动画

      本文链接:https://www.haomeiwen.com/subject/noxudqtx.html