我注意到一个简单的事情,看着Windows 8屏幕的屏幕,有一个预加载器(或加载图标)是非常有趣的,它有一点重力/摆动效果。我想使用javascript和CSS复制相同的东西,但是我对javascript动画的理解并不多,所以想知道如果能给我一个方向,我可以找到类似的例子。您还可以通过提供类似动画的代码片段来帮助您。
任何帮助将不胜感激。
检查网站
CSSload.这里您可以在几秒钟内使您的CSS加载程序。我做了Windows 8加载器,所以你可以看到它
here。
原文链接:https://www.f2er.com/windows/372510.html@keyframes orbit { 0% { opacity: 1; z-index:99; transform: rotate(180deg); animation-timing-function: ease-out; } 7% { opacity: 1; transform: rotate(300deg); animation-timing-function: linear; origin:0%; } 30% { opacity: 1; transform:rotate(410deg); animation-timing-function: ease-in-out; origin:7%; } 39% { opacity: 1; transform: rotate(645deg); animation-timing-function: linear; origin:30%; } 70% { opacity: 1; transform: rotate(770deg); animation-timing-function: ease-out; origin:39%; } 75% { opacity: 1; transform: rotate(900deg); animation-timing-function: ease-out; origin:70%; } 76% { opacity: 0; transform:rotate(900deg); } 100% { opacity: 0; transform: rotate(900deg); } }
或者,尝试this code example …