Ability to scroll using javascript actions in the All New Captivate , 2023.
With the release of all new Adobe Captivate 2023, instructors have the feasibility to author E-learning content with the ability to scroll vertically apart from the traditional slide based method. The feature allows authors to stack content blocks and other available widget containers vertically without any restriction of the slide height. Learners would be presented with an option to access the extended content, with the availability of scroll bar while consuming the content on a browser window.
With the introduction of this feature it also becomes imperative that tool allows me an interaction to scroll content vertically may be on a click of a button/or any other interactive content, but before you realise there is no such action in the interaction panel, let me remind you of the magic wand that all new Captivate 2023 inherits from Captivate Classic!
Its the all powerful javascript editor under interactions and we can utilize a javascript function to scroll to the required element on the page.
let me put the code snippet here :
const content_block = document.getElementsByClassName(“cp-cb__container cp-cb__container”);
content_block[5].scrollIntoView({behavior: “smooth”,});
to understand the above code , you can refer to my video.
Happy Captivating!!
.png)
.png)
.png)
We would like to utilize this functionality in our new Captivate (12.4) long scroll projects.
We have created a test project to mimic the one in the video – but when adding the javascript, the Done button is not enabled.
We have tried changing the snippet from content-block to text_block without success. We are unfamiliar with javascript and are not sure how to proceed.
Any help or insight would be greatly appreciated.
Thank you!
Attachment 
Hi Lieve,
scenario 1:
If its more like you don’t want to allow learners to click and scroll until prior interactions are complete we can keep the following content sections hidden(hiding content section does not reserve space) and allow scroll once interaction is complete. So your interaction would go like:
if standard state of UIC ( one or more be viewed )
then
1) Show content block :
2) followed by javascript code to scrollIntoView()
scenario 2:
show following content only after certain content is consumed which may not necessarily have an interaction, say the criteria could be time spent .. we can write javascript function to prevent scroll until that time.
Let me know if any one of the above fits into your use-case.
regards,
Aditya
How do you cope with ‘Forced View’ which is – sadly – often required by clients if you use infinite scrolling?
You must be logged in to post a comment.
