Skip to main content
S
Shaye288885574y88
Inspiring
October 23, 2023
Answered

How to make a button show an object state plus another clickable button

  • October 23, 2023
  • 1 reply
  • 878 views

Hi all 

I've spent hours trying to figure this out. I've scoured tutorials and forums, this forum included, played around with different methods such as using object states instead of buttons and vice versa, and somehow I'm still not achieving what I'm trying to do. 

 

I'll try explain what I'm trying to do as best I can: I have an image of a moon. I have another image of the same moon, but glowing. I have some text that says "Back to Contents". 

The goal: The image of the moon appears on screen. When the cursor hovers over the moon, the glowing moon will show, as well as "Back to Contents" button. "Back to Contents" is to be a clickable button that when clicked, will take you back to the assigned contents page. If the cursor is moved away, the regular moon will show again. 

 

No matter what I try, I keep hitting problems. For example, in one attempt, I turned the regular moon into a rollover button that is set to go to glowing moon (object state), plus the text (seperate object state). The glowing moon appears, but not the text. Or, the text appears on screen immediately instead of only showing when it is meant to. In another attempt, I've tried grouping the text and glowing moon, making them the same object state, but once I roll over the regular moon, it will show the glowing moon and the text button, and once I move my cursor away the regular moon will reappear, but the text will stay. I've tried making things show/hide, hidden until triggered, etc. But so far I haven't been able to solve this even though it seems simple enough. 

 

This is for a university project to be exported as an EPUB. We can also submit our packaged indesign file, so in the event that the epub doesn't work, they can refer to the raw file to see how it was intended to look. I know rollovers aren't optimal given the use of touchscreens, but this project is with the viewer using a computer in mind, hence I'm using rollovers. Additionally, they require us to use MSOs. Making the glowing moon an MSO is so far the only way I can achieve the desired affect, as this allows the regular moon button to have a "go back on roll off" function, making the regular moon reappear once the cursor is moved away. It's the additional clickable button to take the viewer back to the contents page that seems to be making things more complicated. 

 

If anyone can think of anything that might solve this, it'll be much appreciated. I feel like there isn't anything I haven't already tried, but maybe I'm missing one step that would fix everything. Thanks so much for reading. 

 

    This topic has been closed for replies.
    Correct answer Shaye288885574y88

    To make this work the way you want? Yeah, without sitting down and doing it, that's my thought on it.

     

    I've created MSOs with almost 100 states. These tools are wonky as hell but they can create some pretty interesting effects. Try it and if you have more questions, post the followups.

     

    If you're going to be doing a lot of this, I highly recommend installing this free add-in/script: Object States Assistant for Adobe InDesign – Automatication

     

    I check these post via email most of the time so you might want to tag me if you want to be sure I see it.


    I did what you said, but in addition I selected the glowing moon gave it "On Roll Off" with the action "go to state 1" (that being the regular moon) and now it works perfectly. I was in the middle of writing a lengthy email to my lecturer so this saved me that mission. Never would've thought the solution to all this was as simple as that lol. 

     

    Thank you so much for your help. Big legend energy!

    1 reply

    BobLevine
    Community Expert
    BobLevineCommunity Expert
    Community Expert
    October 24, 2023

    Try this:

    Convert the first moon to a button. Then group the objects (glowing moon and the button) for the second state.

    Create the MSO with those states. 

    With the first state visible, select the moon button and add the action, on hover, go to state and select the second state.

    Make the second state visible and select the button. Add the appropriate go to action to it with an on tap or release.

    (edit: you're going to need to tweak this to get back to the first state so maybe add that action to the same button)

     

    As someone who has created more MSOs and buttons than I can count, I would never use a hover effect and you can point your teacher here and I will be happy to have that debate. It is an absolutely horrible thing from a UX standpoint to do. 

    S
    Shaye288885574y88Author
    Inspiring
    October 24, 2023

    Just to clarify so that I understand correctly: 

     

    Must that regular moon button be an object state too, so that it sits as state 1 with my grouped glowing moon and back to contents text being state 2? 

     

    (PS: I will probably have more follow up questions along the way, so my apologies if it gets a bit annoying for you to go back and forth with a random student who can't grasp indesign lol)   

    BobLevine
    Community Expert
    BobLevineCommunity Expert
    Community Expert
    October 24, 2023

    To make this work the way you want? Yeah, without sitting down and doing it, that's my thought on it.

     

    I've created MSOs with almost 100 states. These tools are wonky as hell but they can create some pretty interesting effects. Try it and if you have more questions, post the followups.

     

    If you're going to be doing a lot of this, I highly recommend installing this free add-in/script: Object States Assistant for Adobe InDesign – Automatication

     

    I check these post via email most of the time so you might want to tag me if you want to be sure I see it.

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices