1
私はこのアニメーションで2枚の写真があり、前の2枚の写真がマージしたときにその場で3枚目の写真を作りたいと思います。 2人はお互いに向かって走っていて、私は彼らをスクリーンの真ん中で抱き締めたい。私は英語が悪いので、私はそれをうまく説明することを願っています。ここに私のコードです。前もって感謝します！3枚の画像を含むCSSアニメーション
<!DOCTYPE html>
<html>
<head>
<title>Animacija</title>
<style>
.from-left {
position: absolute;
left: -100px;
animation: move-right 3s ease forwards;
}
.from-right {
position: absolute;
right: -100px;
animation: move-left 3s ease forwards;
}
@keyframes move-right {
100% {
left: calc(50% - 50px);
}
}
@keyframes move-left {
100% {
right: calc(50% - 50px);
}
}
</style>
</head>
<body>
<div class="container">
<img class="from-left" src="john.jpg">
<img class="from-right" src="catana.jpg">
</div>
</body>
</html>
はどうもありがとうございました！しかし、私にあなたのソリューションの完全なコードを与える機会はありますか？ランダム写真で。それは素晴らしいだろう！ –
申し訳ありませんが、StackOverflowはコード作成サービスではありません。私はあなたに何をすべきかの明確なガイドを与えました。正直なところ、それはかなり簡単です。しかし、このコードが実際に何をしているのか考えなくても、他の人が行ったコードをコピーするのではなく、自分でそれをやろうとすると、さらに多くのことを学ぶことができます。 –