I have a new project I'm working on and it uses a lot of Web Objects as background images. I've been using Adobe Animate to create looped animations, they look great and play independent of the timeline. The problem is once loaded to a server, even though small (100k avg) they load after the other elements. So I've been adding manual fades, but it still gets a little lag on load. Is there anyway to make the web objects pre-cache with the other items, or by any chance are their plans to incorporate this?
I'm pretty sure web objects in Storyline are rendered inside iframes, and they're not really built for preloading. Saying that, if you're creating these web objects yourself I imagine you could place a javascript function inside your web object and use that to determine when the content has loaded.
For example (haven't tested this, so not sure if it works):
Create a Storyline True/False variable called "backgroundLoaded" and set it to False by default
Pause the timeline of your slide on timeline start to prevent anything from happening
Put something like this in your web object's script tag: var player = GetPlayer(); function backgroundLoaded() { player.SetVar("backgroundLoaded",true); } window.onload=backgroundLoaded;
Hypothetically the above code should be getting your Storyline variable and setting it to true once all the content within the web object has loaded.
Setup a trigger to resume the timeline once backgroundLoaded = true
It's not as good as if the content was preloaded, but it should at least help to make things more seamless. It sounds like a really interesting idea using Adobe Animate for dynamic backgrounds, so let me know if it works for you! I'd love to see the result.
2 Replies
Hey Joshua,
I'm pretty sure web objects in Storyline are rendered inside iframes, and they're not really built for preloading. Saying that, if you're creating these web objects yourself I imagine you could place a javascript function inside your web object and use that to determine when the content has loaded.
For example (haven't tested this, so not sure if it works):
var player = GetPlayer();
function backgroundLoaded() {
player.SetVar("backgroundLoaded",true);
}
window.onload=backgroundLoaded;
Hypothetically the above code should be getting your Storyline variable and setting it to true once all the content within the web object has loaded.
It's not as good as if the content was preloaded, but it should at least help to make things more seamless. It sounds like a really interesting idea using Adobe Animate for dynamic backgrounds, so let me know if it works for you! I'd love to see the result.
Thanks. I'll try this out. :)
This discussion is closed. You can start a new discussion or contact Articulate Support.