marqueeタグってご存知ですか？文字などが横に流れていくあれです。古いホームページではよく見かけますよね(笑)。 わざと古めかしいサイトを作るときなどはmarqueeの動きを取り入れると思いますが、marqueeタグは現在廃止されているので、使用するのはおすすめできません。 <marquee>: マーキー要素 (廃止) - HTML: HyperText Markup Language | MDN 代わりに↓のDOMOのようにmarqueeと同じような動きを実現できる方法をご紹介します。 今回は背景を動かす方法です。

CSS

      
    div.loop_box {
        border-bottom: 1px solid #61625d;
        height: 40px;
    }
    div.loop {
        position: relative;
        background: url(../img/cording/loop.png) left center repeat-x;
        background-size: auto;
        height: 100%;
        -webkit-animation: loop 50s linear infinite;
        -moz-animation: loop 50s linear infinite;
        animation: loop 50s linear infinite;
    }
      

上記のように、CSS animationでループすれば、流れていく背景が実装できます！ サイトに動きを出したいときなど、ご活用ください。