##実装したい事
下記のコードですと動きがループされるんですが、
このループを止めて、なおかつ一定の位置で動きを止めたいのですが
なかなか動きを止めることができません、お分かりになられる方是非よろしくお願いいたします。
一定の位置とは1枚の画像の終わり(端)です。
css
1.top1 img { 2 -webkit-animation:animation-top1 20s infinite linear; 3 animation:animation-top1 20s infinite linear; 4 height:100%; 5 width:100%; 6} 7@keyframes animation-top1 { 8 9 from{ 10 -ms-transform:translateY(-30px); 11 -webkit-transform:translateY(-30px); 12 transform:translateY(-30px); 13 } 14 to{ 15 -ms-transform:translateY(0); 16 -webkit-transform:translateY(0); 17 transform:translateY(0); 18 } 19}
HTML
1<div class="top1"> 2 <img src="img/top.png" alt="動かして一定の位置で止めたい画像"> 3</div>
お時間ある方お助け下さい、よろしくお願いいたします。
回答2件
あなたの回答
tips
プレビュー