Skip to main content
zMerlinz
zMerlinz
Inspiring
May 14, 2019
Answered

Use HTML to launch a slide:

  • May 14, 2019
  • 4 replies
  • 372 views

Situation:

Looking to see if it is possible for a user to click on an html link that will open a captivate slide.

For example:

A  single html document that has 30 study subjects on it. When the user clicks on a subject they want to study, it should open up a captivate slide that holds the study material.

Not too concerned with the cosmetics, just looking to see what javascript and/or html code is needed to make it happen.

This topic has been closed for replies.
Correct answer zMerlinz

After deep thought process, positive feedback from here, some nights & days with "hot mocha" & trial/error, this approach works perfectly for me and hopefully be helpful for others.

*Note this approach is for those wanting to take an external html file and link it to a specific slide within captivate, if you are building within captivate, then use the provided features within the program.

tested on:

CP2019

We execute this in a custom html just above the header tag:

<!-- Custom slide jumper -->

<script>

  $(document).ready(function()

  {

  $("#link").click(function(event)

  {

  window.parent.window.cpAPIInterface.setVariableValue( 'cpCmndGotoSlide',0);

  });

  });

</script>

</head>

then add this inside the body tag:

<body>

<a id="link" href=""><img src="../img/back.png" alt="home" class="nj-home"></a>

.... your other inputs........

</body>

You can customize the image source link to include class as well.

for me, inside the javascript ( 'cpCmndGotoSlide',0);

The 0 refers to the slide number, so basically when the user clicks on a custom image, it takes them back to the starting point. I have used this approach for other areas in my project by changing the 0 to any slide I want the user to go to and it works

flawlessly.

Cheers,

Scott

4 replies

zMerlinz
zMerlinzAuthorCorrect answer
Inspiring
May 23, 2019

After deep thought process, positive feedback from here, some nights & days with "hot mocha" & trial/error, this approach works perfectly for me and hopefully be helpful for others.

*Note this approach is for those wanting to take an external html file and link it to a specific slide within captivate, if you are building within captivate, then use the provided features within the program.

tested on:

CP2019

We execute this in a custom html just above the header tag:

<!-- Custom slide jumper -->

<script>

  $(document).ready(function()

  {

  $("#link").click(function(event)

  {

  window.parent.window.cpAPIInterface.setVariableValue( 'cpCmndGotoSlide',0);

  });

  });

</script>

</head>

then add this inside the body tag:

<body>

<a id="link" href=""><img src="../img/back.png" alt="home" class="nj-home"></a>

.... your other inputs........

</body>

You can customize the image source link to include class as well.

for me, inside the javascript ( 'cpCmndGotoSlide',0);

The 0 refers to the slide number, so basically when the user clicks on a custom image, it takes them back to the starting point. I have used this approach for other areas in my project by changing the 0 to any slide I want the user to go to and it works

flawlessly.

Cheers,

Scott

zMerlinz
zMerlinzAuthor
Inspiring
May 14, 2019

Both feedbacks are important and wanted to provide an illustration to help generate the thought process even more. Below is a screenshot of an independent html accordion format displaying options to the user. When the user clicks on the item identified in red, there should be a "code" that will take the user to the assigned captivate slide #. That is what I chasing after.

I found this link and wondering if this is the route to take or if there is a more efficient of way accomplishing my objective.

https://forums.adobe.com/thread/1339949

Lilybiri
Lilybiri
Brainiac
May 14, 2019

Why not realiae this in one project? I don't understand, must be me.

Paul Wilson CTDP
Paul Wilson CTDP
Adobe Expert
May 14, 2019

I've done something similar in the past when I had to offer copies of my elearning courses to volunteers who did not have employee logins and passwords to access the learning management system. Essentially I published a bunch of my elearning courses with reporting turned off so what you had when completed was a bunch of folders containing more folders and files and an index.html file for launching the course. I put them all in a folder and uploaded the single folder to my web server. In the root folder I placed a hand written main index.html file that included links to all the elearning index.html files in the subfolders (the courses). My main launch page included code for each course similar to what I highlighted here:

This is just one example, but I could duplicate this line dozens of times with the updated links and proper titles for each module and people would be able to launch any one of the modules they wished. You could even have the course return to this page when they completed the module. Again, remember that there is no tracking or reporting with this sort of solution but essentially elearning is just one big web page.

Paul Wilson, CTDP
Lilybiri
Lilybiri
Brainiac
May 14, 2019

Bit confusing question.  You have one slide Captivate files that you want to run from an HTML page? If yes, publish the Captivate files to a webserver, and call their index.html file in an iFrame. That is not a real Captivate question or I can misunderstand of course.

Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices