Copy link to clipboard
Copied
Hi,
So i am trying to create a Next and Previous button with Html, Css and Javascript. The reason for this is because it's retina friendly.
I have found this post: Javascript go to next slide from Web Object and tried to add the following line of code in my html file:
<button type="button" onclick="parent.cp.goToNextSlide()">Continue</button>
So the html file looks like this:
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<button class="volgende" type="button" onclick="parent.cp.goToNextSlide()">Go to next slide</button>
</body>
</html>
I published the file on my webserver and added the link in a web object in Captivate.
Unfortunately the button doesn't work.
Does anyone knows what i'm doing wrong here?
Copy link to clipboard
Copied
Where is the Web Object, that page you are linking to in relation to your Captivate published file?
Open the console and see what errors are being generated, if any. Press F12 in the browser.
Copy link to clipboard
Copied
The web object is in a folder on my webserver where my website is running aswell.
The following warnings and errors showing up in the console:
Copy link to clipboard
Copied
I don't think the code you are using is not going to work since the webpage is not actually a child of the Captivate file. It's just a link.
Don't have access to my server at the moment to test, but you could try this JS:
window.opener.cp.GoToNextSlide()
Copy link to clipboard
Copied
Thanks for the reply,
Unfortunately window.opener.cp.GoToNextSlide() doesn't work.
Copy link to clipboard
Copied
Try running this JavaScript and see what it logs:
console.log(window.opener, window.parent);
Copy link to clipboard
Copied
Couple of things:
You say that you are putting these buttons in a separate web page because they are retina ready, what about the rest of the project that these button at in?
Also, zip that html file an insert as an HTML5 animation. Then use the JavaScript:
window.parent.window.cpCmndNextSlide=1;
or
window.parent.window.cpAPIInterface.next();
Copy link to clipboard
Copied
Thanks TLCMediaDesign for the reply and sorry for the late response. I'm gonna try this code and i will let you know if it works or not.