x轴和y轴的动画分开写,然后两个速度不一样就会形成曲线运动,具体曲线可以通过计算,随便写了个也可以直接给对应关键帧的x,y值
@keyframes bimg1 {
0% {top: 0;}
100% {top: 200px;}
}
@keyframes bimg2 {
0% {left: 0;}
100% {left: 200px;}
}
#item {
animation: bimg1 2s infinite cubic-bezier(0,0,1,1),bimg2 2s infinite cubic-bezier(0,1,0,1);
width: 10px;
height: 10px;
position: absolute;
background: red;
}
搜一下:怎么做一条运动的弧线 css js h5 svg 都可以
Photoshop|
Dreamweaver|
SVG|
WebGL|
Visual Studio|
PowerDesigner|
Eclipse|
Git|
Apache Ant|
Atom|
Composer|
CodeSmith|
Flex|
Gradle|
Maven|
Sublime Text3|
SVN|
Tableau|
Vim|
Chrome开发者工具|
OpenGL|
Unity|
Direct3D|
用户登录
还没有账号?立即注册
用户注册
投稿取消
文章分类: |
|
还能输入300字
上传中....