Animation on layer not working when timeline is paused in HTML5 (triggers also seemingly broken)
Mar 30, 2016
Linear animations are not working in published HTML5 file if the timeline is paused.
Background on what I wish to accomplish: There is a tab that I want the user to be able to click on to pull out a piece of text (the tab is in a separate layer because I hoped this would solve the animation issue). This tab can then be pushed back in. Content will be playing in the timeline (almost like a video with slide controls (pause, skip slide, prev slide, mute), but the user can pause this content at any point as well (i.e. pause the timeline).
The tab itself starts pulled out and then gets pushed in automatically after a few seconds unless a user pushes it back in earlier. After this point the user can keep pulling it out and pushing it in for as long as they like. The tab works fine when the main slide timeline is running, but if I pause the timeline (using the pause button which has a pause timeline trigger) then the pullout tab no longer works properly and in fact breaks a bunch of the triggers for the tab.
This, however, only happens in the HTML5 published file and not in the regular story.html published file. Similarly, the internal Storyline preview functionality shows the exact behaviour that I want.
I've attached a .story that can be published to have a better grasp of my issue.
This isn't the first issue I've had with the HTML5 published file - another consistent one for me has been the positioning of elements in the published file. If you take a look at the closed captioning text in the (currently it is just counting from 0 - 10, sorry, I had to strip any actual content in this file because it is all confidential) it does not have the same positioning as it does in the Storyline preview or even the story.html (i.e. flash) output. This positioning issue is not as big a deal however as I can reposition things manually.
I'm afraid I have to use HTML5 due to the need for this to be playable on an iPad and it really seems like it's a bug with the HTML5 output as it does not match the Storyline preview or published flash package.
Am I missing something or is this a possible bug in Storyline? Are there any suggestions as to how I can proceed in order to have this functional?
8 Replies
Hi Aleksandar!
Thanks for sharing your file and allowing me to take a look.
Do you see an issue with my published file in SCORM Cloud:
https://cloud.scorm.com/sc/InvitationConfirmEmail?publicInvitationId=e1e3e815-6b01-4ba5-bdac-9808dc6de479
If so, can you share the steps to replicate as it appears the same to me on my PC with the Flash output and viewing on my iPad in HTML5. I'm not sure if I'm missing something or if the issue may be limited to your LMS.
Hi Leslie,
I just noticed that my reply from yesterday never seemed to have gone through so I'll do a quick summary:
We are using either the index_lms_html5.html or story_html5.html published file on our deployment (I can't remember which but I've tested both and they both have the same behaviour) because we do not want the player to default to flash at all even if it is available (it seems that story.html has that behaviour).
I've tested these files on both our own testing SCORM cloud deployment (I'm afraid I can't share the link as it is confidential) and locally on Chrome, Firefox, and Edge, and all of them give me the same problem.
One other thing to note as I don't know if this affects anything, but in the publishing options we are selecting AICC as that is the format we need for an LMS integration.
Please let me know if you need any further information and if you are still having trouble replicating the error I'll try to be more detailed or do a quick screencap in case I'm missing something.
Thank you very much for looking into this for me.
Regards,
Aleks
Firefox and edge are unfortunately not supported by Articulate for viewing the HTML5 content.
there is a bug in HTML5 content when using the pause interaction, but I think some of the reason this is happening is the the way this is built, I wouldn't use motion paths, instead i would use a layer with and object with a fly in and fly out animation set to pause.
something like this https://www.dropbox.com/s/lctlapho1xiozox/Circular%20Menu.story?dl=1
Hi Phil,
Thank you for the .story file, that menu looks fantastic! I can see there's still lots I can learn about Storyline.
That said, I'm having a bit of trouble figuring out exactly how the menu works. I can see that two different states on the initial menu button, but I am not understanding how the opening animation works and the purpose of the variable that is being adjusted.
I feel like I'm missing something obvious, but I'm completely stumped so if you could point me in the right direction I would greatly appreciate it.
Thanks,
Aleks
Never mind, just found the Activated layer on the master slide and will study it to see if I can figure out how it works.
Hi Aleks
I find that really funny because I stared at you file for ages before I could work out how you were doing it.
Mine is very simple, on the slide master (top slide) there is a layer which is called by changing the variable
Sent from my iPhone
Beat me to it
Sent from my iPhone
Hi Phil,
So I've been playing around with the .story that you sent me but it seems that your solution has the same problem that mine did when using the HTML5 published file.
If I pause the timeline and then click on the menu, it opens up fine and without a hitch. Unfortunately, as soon as I click on the Close button, it closes the menu fine but restarts the timeline for no apparent reason. This isn't the behaviour in the preview and it just seems like the HTML5 published file has some bug that causes layer animations not to work when a main timeline slide is paused.
It's essential that the animations don't break my play/pause button because the user is meant to be able to review the content in the pullout tab when they've paused the content. The text contained in the tab is a little prompt on the content they are viewing that they can remind themselves of. We are expecting that most users will want to open that tab while they've paused the main audio/visual track just in case they wish to review what that aforementioned prompt was.
Judging by the difficulty I've been having to accomplish this with HTML5 I might recommend that we just use a bit of screen real estate to have the prompt displayed for the entirety of each slide and not be in this pullout tab format. I thought I'd double check with you first though in case you have another trick that might be able to circumvent this bug.
Thanks again for all your help.
Regards,
Aleks
This discussion is closed. You can start a new discussion or contact Articulate Support.