How do I split an image using Javascript + CSS?
I have an image like this:
I want to split it into six squares, and I can continue to loop to display the animation. Do you have any ideas to split the image into JS + CSS instead of using 6 separate image files.
+2
DNB5brims
source
to share
3 answers
Here's an article from SitePoint on animating a sprite with jQuery.
+4
wongo888
source
to share
Set it as a background image and process the position of the background.
Update: As seth mentioned, this method is called CSS Sprites. Searching google for animation with css sprites gives good results.
+8
Chris van opstal
source
to share
There are at least two methods
- Use image as background
- Use CSS clip
Here is a good example of using the first technique.
+1
Cleiton
source
to share