kostenloser Webspace werbefrei: lima-city


Sprite Animation fehlerhaft

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    mehralsnurradio

    mehralsnurradio hat kostenlosen Webspace.

    Ich möchte eine Sprite Animation erstellen, wo eine Karte animiert wird.
    Das Problem ist, dass die Animation zwar funktioniert, parallel aber die ganze Karte dauernd von rechts nach links läuft.
    <div id="background-animated"></div>
    
    <style>
    #background-animated{
      width: 256px;
      height: 256px;
      background-image: url(...);
      position: absolute;
      background-position: 0px 0px;
      left: 0px;
      top: 0px;
      animation: play 2s steps(60) infinite;
    }
    
    @keyframes play {
    100% { background-position: -16384px; }
    }
    
    </style>
    Das Bild: https://fumoc.de/img/animation/TOTY_ATT_LEGEND.png
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!