Prev/Next button incorrectly appearing in HTML5

Mar 31, 2015

One of my colleagues has an issue with a SL2 module and I thought I'd share here:

She's using a freeform drag and drop interaction that resets to initial state upon each unsuccessful attempt.

We use custom navigation throughout our modules with all default navigation such as the previous and next buttons disabled.

The issue she is getting (in HTML5 only... both iOS7.3.1 and Android 4.4.2) is that an unsuccessful attempt will reset as intended but also display the default Prev/Next buttons in the location of the seekbar which is also disabled. (see attachment)

I've checked and these buttons are not ticked within properties of the slide and the associated results slide and this problem doesn't occur in its flash equivalent.

Any takers?

Edit: Removed "Freeform" from thread title as this issue applies to all quiz elements when viewed as HTML5. 

45 Replies
Suraj More

Hi Liesbeth,

Did you try the temporary solution by inspire group in these comments. That worked for me.

As a temporary work-around, we're running a bit of JavaScript.

On the 'free-form' slides

open triggers

create a JavaScript new trigger

place this in the JavaScript editor:

(function(){

var head = document.querySelector("head"),

injectCSS = "#control-next{visibility: hidden;}#control-previous{visibility: hidden;}"

if(!head.innerHTML.match(injectCSS)){

head.innerHTML += injectCSS;

}

}());

Liesbeth van den Berg

We have tried that work around, however with no success. The only difference is that we're using a multiple choice question (not free form drag and drop). However, I can't imagine this being the issue. 

Our issue is that when one goes back to the question after selecting the correct answer and reading feedback (only then) the prev. and next button appear over our self made (prev/next) arrows. 

Mark Lester

Hi Leslie,

Are you able to contact your QA team to ascertain an estimated timeframe for resolving this issue?

I believe 10 months is an sufficient amount of time for some progress to be made and the current status of "do not have an update to provide at this time" is somewhat disappointing considering the time myself and others have taken to advise you of this ongoing issue with Storyline HTML5 output.

Although the Inspire Group's (thanks again guys!) JavaScript solution does resolve Prev/Next button issue it's not a complete fix as it limits the use of certain storyline functions such as entrance animations and (as the author states) noticeably increases slide loading times so it's not a viable long term solution.

Thanks in advance,
Mark

Wendy Morgan

I am having the same problem, and we already have the freeform slides set to "unlimited" tries. Translating the project to Articulate 360 destroys much of the slide master design, so it's best to keep the project in Storyline 2. Question about the Java addition: should this Java run at the start of the timeline? How does keeping the slide in the "resume saved state" setting affect it?

Thank you!

Ashley Terwilliger-Pollard

Hi Wendy, 

This issue in SL2 where the prev/next buttons appear during Review in the HTML5 output even though they're disabled is still with our QA team. 

I'd like to find out a bit more about what is happening with your slides when upgrading them to Storyline 360? You said it destroys much of the slide master design? Are you using the same story size across both projects? Do items shift on the slide, or something more drastic? 

If you're able to share a copy of your SL2 file I can give it a test upgrade too.  Just use the "Add Attachment" button at the bottom of the reply window. 

I'll leave the Javascript piece to the community - as we don't support Javascript, nor would I even know where to begin! 

Lizzie Wakefield

GOSH! this has been going on for 2years and still no fix!?

I have the same problem - and there is no worka round, I have a course with info - lots of the info is in layers which are all custom so work fine. 

But then I have a revision quiz which if you get a question wrong asks you to re-review the learning - great perfect time for a lightbox, but once the lightbox closes there are those pesky prev/next buttons on my incorrect layer.

None of the fixes work - I have tried.

Yet another case of "we'll get right to it" from the Storyline fixes team.

Ashley Terwilliger-Pollard

Hi Lizzie,

You mentioned a lightbox, which I don't see in anyone else's description and since the other fixes didn't work for you, I'd like to take a look at it and see if this is a different issue. Can you share the .story file with us here or send it along to our Support team here? 

Can you let me know if you're also seeing this only in the HTML5 output, and what browsers you're testing it in?

Rodrigo Sugahara

Hello, guys! I don't know if this has been fixed yet... It's still an issue for me.

I got a workaround:

  • After publishing your course, open your story_html5.html file.
  • Find the <div> with the ID controls. 
  • Find the <div>'s with the id control-next and control-previous and comment them.

I'm attaching a  screenshot.

It's important to note that this workaround will prevent those buttons to show entirely, so it only works if you are using custom buttons. 

I hope to have helped a bit!

Best regards.

This discussion is closed. You can start a new discussion or contact Articulate Support.