+ 1
Is we can give direction any object in svg animation ?
If yes than how can.......
1 Resposta
+ 1
<!--I change like this, the direction of rotation.-->
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
body{
text-align: center;
padding-top: 10%;
background: #fcfcfc;
}
svg{
animation: girar 2s ease-out infinite;
}
@keyframes girar{
0% {transform: rotate(-360deg);} /*Change for positive*/
50% {transform: rotate(180deg);}
100% {transform: rotate(360deg);} /*Change for negative*/
}
</style>
</head>
<body>
<svg width="200" height="200">
<rect width="200" height="200" style="fill:rgb(0,0,200);stroke-width:5;stroke:rgb(211, 100, 13)" />
</svg>
</body>
</html>