0
132
ViewsAnimate image "roll" using JavaScript
In NumPy, there is a function called roll. The documentation describes it as follows:
Roll array elements along a given axis.
Elements that roll beyond the last position are re-introduced at the first.
Concretely, calling roll on an image could produce the following shifted version:
My question is how to achieve the same effect in JavaScript for arbitrary shift values along the width and height axes and how to make it animatable, such that one can see the transition from the original image to the shifted version.
·
Juan Pablo Isaza
1 answers
Answer question0
So the answer is embarrassingly simple. It can be achieved like so:
#imageDiv {
background-image: url(the_image.png);
background-repeat: repeat;
}
After which you can simply animate the background-position property on imageDiv (for instance background-position: 42px 69px).
·
Juan Pablo Isaza
Report
Answer question