Button states issue - is it possible?

Jul 31, 2017

Hi I'm attempting to create some button states for an interactive LO (Learning objectives) slide with an image but my results whilst close aren't what I desire. I'm attaching my sample. 

The aim -  I want to display the company logo (Fastway) on 3x LO buttons (tiles) only when the button is 'Normal' (not 'hovered/rolled' or 'Visited').

When they're hovered or selected they disappear to be replaced by some text. When clicked each button open up a LO layer for further details. When closed the learner returns and the LO button displays the 'Visited' state. (No logo)

The problem - the logo is shown on all buttons states.

What I've tried: 

Slide 1

a. Trigger - Change state of Logo to 'Disabled' (image deleted in state) when button is 'Hovered' and 'Visited'. When the mouse is moved off the button returns to 'Normal' but logo doesn't re-appear.

b. Trigger - then I added Change state of logo to 'Normal' when state of button is 'Normal' hoping to force a reset. No luck.

Slide 2

C.  Trigger - Change state of Logo to 'Disabled' when 'Mouse Hovered over' LO button. Clicked 'Restore on mouse leave'. This works when rolled onto then rolled off (logo re-appears!!), however on 'Visited' the logo appears. So, I added a further Trigger - Change state of Logo to 'Disabled' when state of button is 'Visited' yet this doesn't work.

d. I created a variable to detect when button is clicked (True / False) then this would be used to direct when the button should be displayed. This seems far too confuted to be a working solution.

Slide 3.

The logo is an object on it's own but I tried adding it into the button 'Normal' state (nothing else) but this doesn't work. 

Surely, there has to be an easy solution to this, anyone? Appreciated,

5 Replies
Alex Arathoon

Got an update appears. HTML5 output is affecting the rendering of my LO menu blocks. Just exported and ran a Flash version and it's working. I'm using SL2 I wonder if SL3 is any better at all?>

What I did in the working (Flash version):

** Main slide **

Each button: Change state of logo to 'Disabled' when Mouse hovered over button (restore on mouse leave) (Logo deleted on 'Disabled' state)

Each button: Change state of logo to 'Disabled' when user clicks button 

** Slide layers** (For each Learning objectives)

Close button: Change state of logo 'Disabled' when clicked

If we can't get HTML5 to play nicely I guess, I'll simply fade off logo after a few seconds and leave it.



Alyssa Gomez

Hi Alex,

Thanks for sharing your file with me.

The hover and visited states are additive on top of the normal state, so you'll see both states at the same time. In other words, if the logo is used in the normal state, you'll see it in other states, too.

It sounds like you sorted it out by using the disabled state, but I also wanted to share this workaround from another customer who encountered a similar challenge last week.

Alex Arathoon

Thanks for the reply. However, as per my original issue It does seem HTML5 has some issues when it comes to layers.

My Flash output is working but HTML5 has weird artifacts. Text on hover / visited states appearing (not hovered/selected) and then not appearing on Visited state.

This issue goes back to analysis of the audience and modes of delivery. HTML5 is an immature standard and we can't rely on it properly rendering like Flash. Previewing content in Articulate is not the same as testing an output file on intended browsers/devices.  

Ashley Terwilliger-Pollard

Hi Alex,

We've made a lot of improvements in the HTML5 output for Storyline 3 and Articulate 360. 

They both have the HTML5 first or HTML5 only publishing options, and they also preview in HTML5. You can read a bit more about our shift towards HTML5 here. 

You'll also note an increase in the browsers supported with the newer versions of Storyline. 

What browsers were you viewing the HTML5 content you published with SL2? 

Alyssa Gomez

Hi there Alex, thanks for that clarification. Now I see what you're describing. In HTML5, the button's visited state does not appear after closing the layer until you hover over the button a second time. 

We've reported this to our team, and we’ll continue to keep an eye on it to evaluate how many customers are impacted and what impact it has on courses. The number of customers and depth of impact are two of the elements that help us prioritize bugs and fixes.  

Thanks again for bringing it up here, and I apologize that it's slowing you down!

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