Forum Discussion
How do I change state on button when lightbox viewed
Hi, I have a text object on my first screen that opens a lightbox when clicked. I have 3 states on the text (normal, hover and then a custom state called Done what is supposed to display a checkmark beside the text when triggered).
I don't want the Done state to change until the viewer has gone through all the content in the lightbox.
I created a true/false variable called introDone and set the initial value to False.
I added a trigger to the last layer in the lightbox slide to change the variable to true when the timeline starts.
I put another variable on the slide with the textbox to change the state of the textbox to Done when the timeline starts if introDone = true.
It is all very well and good except that it doesn't work - has anyone managed to get this to work? If so, can you share your solution.
15 Replies
Heya Nancy - I think I've done something like this but to be sure, can you post the slide set that illustrates what you want to happen? Is the Done button state on the lightbox slide or the launching slide?
Steve
Hi Steve - I can't post the slide (NDA project) but the Done button state is on the launching slide.
Gotcha. Yep, that's the same problem I solved at one time. I'll see if I can pull out the example I used. As I remember I did this using a couple of different mechanisms under different circumstances. The problem, as I remember, is that while the lightbox is up, nothing happens on the base slide. So any listeners aren't active. I believe the way I worked this was with a layer.
- Have your button pop up a layer when the timeline starts. The layer triggers the opening of the lightbox.
- The lightbox pauses progression of the layer so it won't execute the trigger at the end of the timeline
- When the lightbox closes, the layer continues
- Trigger at the end of the layer to switch your base layer state if a variable meets a certain condition
The layer doesn't need to be very long. 1 second or so.
Hi Nancy, see attached the 'mad scientist' approach; when the three layers in the lightboxed slide have been clicked a variable is set to true. On the base slide, there is a transparent shape that sits just 'underneath' the lightbox's X button. This shape has a hover trigger that changes the text's state to Done, but only if the variable is true. So, when I close he lightbox, the mouse then sits on top of the transparent shape and if the variable is true, then the text's state changes. I hope someone comes up with an easier solution
Edit: I didn't know that HTML5 was a requirement, don't bother with my idea then, it won't work.
Here's an example of what I described above. The interstitial layer is a quarter second to reactivate the button faster. I don't know how this will behave in HTML5. It should act the same.
Nope. HTML5 doesn't work the same way. Looking into why the events aren't firing properly. It doesn't seem to resume playing the layer when the lightbox is closed.
Nope - doesn't resume playing in HTML5. Mucks up the sequence.
Thank guys. HTML5 is a requirement for this one so looks like I might have to do a little redesign.
@Steve, what do you think the html5 bug is with this?
@Michael, I know what the bug is with your example. The lightbox close button doesn't work in html5.
- Yep, my solution wouldn't work in HTML5 (at least not on a touch device) because it relies on a rollover state
Nancy Woinoski said:
@Steve, what do you think the html5 bug is with this?
@Michael, I know what the bug is with your example. The lightbox close button doesn't work in html5.
