Skip to main content
July 18, 2019
Answered

How to move an object between multiple locations using buttons?

  • July 18, 2019
  • 3 replies
  • 739 views

Hello everyone. In a Captivate 2019 course I am creating, I need the user to be able to move an image object between multiple points using buttons. Is there a way to move an object smoothly from one point to another using advanced actions or java script? The reason I ask is because the motion path functionality seems to be tied to the timeline for each slide, which seems limiting. I'd like to be able to indicate, no matter where they are in the timeline, if X button is pressed, move the object from this location to that location. Is that doable? Thank you in advance!

This topic has been closed for replies.
Correct answer Lilybiri

You can launch a motion effect with a button and/or with advanced/shared actions.

Have a look at the blog post I published yesterday, an example of motion effects triggered by a toggle button:

Sliding Menu - Captivate blog

3 replies

Stagprime2687219
Legend
July 18, 2019

Better yet - You could also create a little directional pad and use them to nudge your object so many pixels in a particular direction.

For that just use a  +=  or a  -=  in front of your pixel distance. This would be for an object with the name of  box.

Right Button

$(document).ready(function() {

$("#boxc").animate({left: "+=50px"}, 500);

});

Left Button

$(document).ready(function() {

$("#boxc").animate({left: "-=50px"}, 500);

});

Up Button

$(document).ready(function() {

$("#boxc").animate({top: "-=50px"}, 500);

});

Down Button

$(document).ready(function() {

$("#boxc").animate({top: "+=50px"}, 500);

});

July 18, 2019

This was helpful information for the future as well! Thank you!

Stagprime2687219
Legend
July 18, 2019

This little block of code would move a box on your stage with the name of box to the right by 150 pixels over the course of a half second.

If you want to move something to the left - still use left but put in a negative value for the pixels.

If you want to move something up or down - use top instead of left with plus or minus values in the same way.

$(document).ready(function() {

$("#boxc").animate({left: "150px"}, 500);

});

Lilybiri
LilybiriCorrect answer
Legend
July 18, 2019

You can launch a motion effect with a button and/or with advanced/shared actions.

Have a look at the blog post I published yesterday, an example of motion effects triggered by a toggle button:

Sliding Menu - Captivate blog

July 18, 2019

Super helpful - thank you!

Lilybiri
Legend
July 18, 2019

You're welcome. I'm sure that with JS much more can be achieved, but tried to show what is possible with motion paths in Captivate.