6
ismindeki bir animasyon buradaki gibi olduğunu varsayalım: http://jsfiddle.net/utterstep/JPDwC/CSS3 animasyonunda belirli ana kareye nasıl taşınır?
Düzen:
<div>back</div>
<div class="animating"></div>
<div>forward</div>
Ve tekabül CSS:
@keyframes someanimation {
0% {
width: 100px;
}
50% {
width: 200px;
}
100% {
width: 100px;
}
}
.animating {
width: 200px;
height: 200px;
background-color: red;
animation: someanimation 5s infinite;
}
Ve ne zaman bir sonraki veya önceki animasyon durumuna dönmek istiyorum geri veya numaralı telefonu numaralı telefona iletebilirsiniz. Birden fazla nesne olabilir ve animasyon durumlarını aynı anda değiştirmek istiyorum.
CSS veya CSS + JS aracılığıyla bir şekilde mümkün mü yoksa, ya da sadece benim saf JS kodumu yeniden yazmak için daha kolay olabilir mi?
Eğer "önceki" ve "sonraki" ne demek istiyorsunuz düğmesi geri mi, Üzerine giderek animasyon değiştirir? Animasyon durumunu değiştirmek için herhangi bir oynatma/duraklatma düğmeniz var mı? – Passerby
[Bunu] deneyin (http://stackoverflow.com/questions/16150846/jquery-continous-back-and-forth-rotation-animation) Veya [Bu] (http://stackoverflow.com/questions/9536633/css -animations-değişim-a-mülkiyet-geçişi olmadan) – Amol
@Passerby belirsizlik için özür dilerim. Bir şekilde bir sonraki tanımlanmış duruma (_jump_) (örneğin,% 0 veya belki% 13'lük bir seviyedeyim ve "sonraki" e bastığımda,% 50 durumuna geçmek istiyorum) merak ediyorum. –