Notification
Newbie
10 posts
OK…I’m on a roll this week with JavaScript questions.
I’m attempting to use JavaScript to move an object off the side of the page and then back on when you select a button.
Here’s the code I used:
var obj = document.getElementById( ‘re-txtField_2c’ );
var posX = parseInt( obj.style.left );
obj.style.transition = “.4s”;
obj.style.left = (posX + 910) + ‘px’;
I had code to bring the button back as well, but it doesn’t seem like I need it. Through troubleshooting one problem, I learned that this will move my object off the screen, and then it slide back to it’s original position.
Here the problem I’m having…select the button the first time and everything works fine. Select it a second time in a row, and it moves the object off the screen but doesn’t bring it back. Select it a third time in a row and nothing happens.
I put the same code on a second button. Now, if I alternate between selecting button One and Two everything seems to work fine….but if I select either button more than once in a row things break….but, they are fixed if I then select the other button.
I’m very, very new to trying to work with JavaScript (especially within Captivate) so I’m sure there is some nuance or rule that I’m unaware of that is causing me difficult.
Thanks in advance for the help!
Jay
OK…I’m on a roll this week with JavaScript questions.
I’m attempting to use JavaScript to move an object off the side of the page and then back on when you select a button.
Here’s the code I used:
var obj = document.getElementById( ‘re-txtField_2c’ );
var posX = parseInt( obj.style.left );
obj.style.transition = “.4s”;
obj.style.left = (posX + 910) + ‘px’;
I had code to bring the button back as well, but it doesn’t seem like I need it. Through troubleshooting one problem, I learned that this will move my object off the screen, and then it slide back to it’s original position.
Here the problem I’m having…select the button the first time and everything works fine. Select it a second time in a row, and it moves the object off the screen but doesn’t bring it back. Select it a third time in a row and nothing happens.
I put the same code on a second button. Now, if I alternate between selecting button One and Two everything seems to work fine….but if I select either button more than once in a row things break….but, they are fixed if I then select the other button.
I’m very, very new to trying to work with JavaScript (especially within Captivate) so I’m sure there is some nuance or rule that I’m unaware of that is causing me difficult.
Thanks in advance for the help!
Jay
You must be logged in to post a comment.
- Most Recent
- Most Relevant
Would be interesting to see the difference in developing time, when you use Advanced or Shared actions for the same purpose? Or edit the XML file for motion effects. Just curious.
OK…took me awhile but, through a combination of the above input and some Googling I found the answer. Here is what finally worked:
function Move() {
$(“#re-imgLsnThreec, #re-imgSeperatec, #re-imgReportIndicc, #re-imgProtScenec, #re-imgPresEvidc, #re-imgMedCarec, #re-imgLsn3KC1c, #re-imgLsn3KC2c”).animate({
left: “1300px”
});
$(“#re-imgLsnThreec”).delay(500).animate({
left: “260px”
});
}
Move();
The first bit of JQuery moves all of my images off of the stage and the second brings back just the one I want. I have my buttons “Executing Javascript” and then I just change the ID of the one I want to come back. I don’t know why I have to preface the objects ID with “re-” or why I have to add the “c” on the end…but another article indicated that was required and the inspector in the browser is showing the elements identified that way.
Thanks for the help all.
Well… so much for the time I spent trying to format this in my 3-line comment box. #ignored
