Hello,
I have an Adobe Edge interactive animation. The blue alphabet (which is actually an image .png) is actually three of the same alphabets in a row (the rest of the image is masked on either end and reaches the edge of the screen) and the image is centered as shown. This way the blue alphabet can be scrolled either left or right to where the letters can be repositioned below the brown alphabet (the brown alphabet is stationary), like a secret decoder ring. I'm using Greensock's GSAP to drag the blue alphabet using the code:
function init(){
Draggable.create(sym.$('Blue'), {
type: "x",
throwProps:true,
zIndexBoost: false
} )
}
The code works flawlessly. However, once I drag the image in either direction I eventually reach the end of the alphabet image in which I can drag it right off the edge of the screen. I want to be able to drag/scroll the image infinitely in either direction. Does anyone know how I can get the blue alphabet image to "wrap around" or loop once it has been dragged a certain amount either way?