html - 画面全体の画像スライド - CSS3

Question

画面の左からスライドインする画像が途中で数秒間停止し、ページ全体に続く例をどこで見つけることができるか知っている人はいますか?

ありがとうアダム

Answer 1

次のように、キーフレーム アニメーションを使用して実行できます。

例

HTML :

<img src='image.jpg'>

CSS :

body { overflow: hidden; }
img {
    position: absolute;
    left: -100%;
    margin: 7em -244px;
    animation: slide 4s infinite;
}
@keyframes slide {
    0% { left: -150%; }
    35% { left: 50%; }
    65% { left: 50%; }
    100% { left: 150%; }
}