basti1012.bplaced.net

Übersicht >> Sprite-Animation
Du siehst gerade eine vereinfachte Darstellung unserer Inhalte. Normale Ansicht mit richtiger Formatierung.

Sprite-Animation

2022-05-19 21:24:00
    Man kennt ja wo auf einen Bild mehrere Bilder darauf sind die nur minimal anders aussehen. Hier ein Beispiel mit einer Glocke, die klingelt

    Code

                                        
                                
    <style>
        .animation {
            width: 109px;
            height: 75px;
            background: url(image/bell.png) left center;
            animation: play 1.4666666666666666s steps(44) infinite;
        }
        @keyframes play {
            100% { background-position: -4796px; }
        }
    </style>
</head>
<body>
    <div class="animation"></div>
</body>