Forum Discussion
Preload webobjects. Is it possible?
Example project to preload an image and insert it into a later slide.
Demo: https://360.articulate.com/review/content/7cde59a5-b4ff-453c-85b7-14a1b78aa751/review
I haven't tested this particular situation, so this is a starting point.
SL displays images using an <image> tag inside an SVG element. In a preceding slide, you could create a new SVG element in JavaScript. Create an <image> element assigned to a (global or otherwise accessible) variable and add that to the SVG. Assign the source to the image, which should load the image data.
On the final slide, access the <image> element using the variable reference you created. Assign all of the attributes of the current placeholder <image> element (except xlink:href) to the new one you have referenced. Then you can use the Element: replaceWith() method to replace the original <image> element with the new one.
You might want to identify where the actual delay is coming from before you resort to all of this though. 😉
Example project to preload an image and insert it into a later slide.
Demo: https://360.articulate.com/review/content/7cde59a5-b4ff-453c-85b7-14a1b78aa751/review
It seems to work overall! However, when loading images from an external URL, the trigger on slide #2 requires some adjustments to function correctly. Specifically, if the JavaScript trigger is set to "When timeline starts," the image does not get replaced. Changing the trigger to "When timeline reaches 0m 0.01s" resolves the issue.
Interestingly, when using images uploaded directly into Storyline, the "When timeline starts" trigger works as intended. I’m not sure why this difference occurs.
Not sure. There was a similar bug reported with audio that was recently fixed. Maybe try the latest release if you don't have it.
I may need to file a bug report, as I tested this with the Private Beta version of SL, and the issue persists.
Thank you for guiding me through everything and providing such well-commented JavaScript code—it’s been incredibly helpful!