Forum Discussion

RobbieChristian's avatar
RobbieChristian
Community Member
3 years ago

Use Javascript to let a slider control the x-coordinate of images?

I want to use a slider to adjust the position of two different images on-screen. I originally thought to use two sliders (linked as the same variable) and have each image act as the thumbs for the sliders. However, the images need to be far wider than the screen, and I'm running into pixelation issues (already submitted a case for that one). In the meantime, I'm thinking outside the box and wondering if, with a little Javascript, one single slider with about 100 steps can control the position of both EPS images as a function. For instance, each step on the slider moves the first image by 10px and the other image by 12 or 15. 

  • MichaelHinze's avatar
    MichaelHinze
    Community Member

    You could do this with right/left motion path animations that are triggered by the slider moving.

    • RobbieChristian's avatar
      RobbieChristian
      Community Member

      Thanks, Michael. Is there a way to make motion paths linear? All the paths seem to have acceleration, and I want everything to move at the same speed from start to finish without speeding up or slowing down.

  • This is perfect, Michael. It's good to be humbled. I haven't ever needed to play with that setting, so I didn't even think of it. Thank you for giving me the exact solution I needed.
    I'm still curious about using a slider to control coordinates with Javascript, but for now, this solves my issue for this project. Thank you!

  • MichaelHinze's avatar
    MichaelHinze
    Community Member

    I'm not sure what you are hoping to achieve with Javascript that you couldn't do with sliders and Storyline triggers. I have built quite complex slider interactions over the years (here is one example) and never had the need for Javascript. Do you have a specific use case in mind?