首页 > 代码库 > css3 图标上下移动动画
css3 图标上下移动动画
@-webkit-keyframes bird{ 0% { -moz-transform: translate(0,0); -webkit-transform: translate(0,0); -o-transform: translate(0,0); -ms-transform: translate(0, 0); transform: translate(0,0); } 25% { -moz-transform: translate(0,-10px); -webkit-transform: translate(0,-10px); -o-transform: translate(0,-10px); -ms-transform: translate(0, -10px); transform: translate(0,-10px); } 50% { -moz-transform: translate(0,-20px); -webkit-transform: translate(0,-20px); -o-transform: translate(0,-20px); -ms-transform: translate(0, -20px); transform: translate(0,-20px); } 75% { -moz-transform: translate(0,-10px); -webkit-transform: translate(0,-10px); -o-transform: translate(0,-10px); -ms-transform: translate(0, -10px); transform: translate(0,-10px); } 100% { -moz-transform: translate(0,0); -webkit-transform: translate(0,0); -o-transform: translate(0,0); -ms-transform: translate(0, 0); transform: translate(0,0); }}
.qi:not(:target),.birds:not(:target),.hong:not(:target){ -webkit-animation-name: bird; -webkit-animation-duration: 5s; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; -moz-animation-name: bird; -moz-animation-duration: 5s; -moz-animation-timing-function: linear; -moz-animation-iteration-count: infinite; -o-animation-name: bird; -o-animation-duration: 5s; -o-animation-timing-function: linear; -o-animation-iteration-count: infinite; -ms-animation-name: bird; -ms-animation-duration: 5s; -ms-animation-timing-function: linear; -ms-animation-iteration-count: infinite; animation-name: bird; animation-duration: 5s; animation-timing-function: linear; animation-iteration-count: infinite;}
css3 图标上下移动动画
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。