Wie teilt man das Bild mit Javascript + CSS?

Question

Ich habe das Bild wie folgt aus:

ich es in sechs Quadrate geteilt werden soll, und ich kann Looping halten die Animation angezeigt werden soll. Haben Sie Ideen, das Bild mit JS + CSS zu teilen anstatt 6 separate Bilddateien zu verwenden?

Answer 1

Hier ist an article from SitePoint auf Sprite-Animation mit jQuery.

Answer 2

Legen Sie es als Hintergrundbild fest und manipulieren Sie die Hintergrundposition.

Update: Wie bereits erwähnt, heißt die Technik CSS Sprites. Die Suche nach Google nach animation with css sprites ergibt einige gute Ergebnisse.

Answer 3

Es gibt mindestens zwei Techniken

• Bild verwendet als Hintergrund
• Verwenden CSS clip

Here ein gutes Beispiel für die Verwendung von erster Technik ist.