Wie kann ich ein Element animieren, um in CSS3 zu schwingen?

Post a reply

Smilies
:) :( :oops: :chelo: :roll: :wink: :muza: :sorry: :angel: :read: *x) :clever:
View more smilies

BBCode is ON
[img] is ON
[flash] is OFF
[url] is ON
Smilies are ON

Topic review
   

Expand view Topic review: Wie kann ich ein Element animieren, um in CSS3 zu schwingen?

by Anonymous » 18 Aug 2025, 05:49

Seit ich die TreAhouse -Website und den Signal -Effekt im Baum gesehen habe, habe ich versucht, sie zu reproduzieren. < /p>

.box{
width:50px; height:50px;
background: blue;
box-shadow: 0 0 5px blue;
margin:100px;
float: left;
-moz-animation: 3s ease 0s normal none infinite swing;
-moz-transform-origin: center top;
}
< /code>

, aber es schwingt nicht.bod{
background:blue;
}
.box{
width:50px; height:50px;
background: yellow;
box-shadow: 0 0 10px red,0 0 25px red inset;
margin:100px;
float: left;
-moz-animation: 3s ease 0s normal none infinite swing;
-moz-transform-origin: center top;
border-radius:50%;
}
@-webkit-keyframes swing {
from {
left: -2px;
}
to {
left: 200px;
}
}
< /code>

Aber das funktioniert auch nicht. Sehen Sie diese Demo auf JS Fiddle.

Top