I am a little behind You as my response demo in this post is based on your first example…
Our overall goal in this demo (per the request in your original post) is to create an interface that works with “Mouse Over” ~ “MouseOut” (no scripting).
This is a problem situation unless the user interaction is tightly controlled. Your initial “Mouse Over~Out” example shows this problem clearly as actions fire all over the place as the user slides the mouse around over various buttons creating an incoherent visual experience. The timelines are also needlessly complex. A “Mouse Click” (or Up~Down) would have been a better choice for this scenario IMO.
In the simple attached “
Demo” there are only two buttons to show the basic concepts. I have put a block on user interaction with the other button by effectively disabling it until the “active” button (i.e. the initial button with a mouse over~out event) is completed, then the “mouse over” event for the other button becomes available.
In addition to the “Main Timeline” there are the “Rectangle” & “Circle” timelines where all the property settings occur.
Note that in the “Rectangle” & “Circle” timelines the “Mouse Over ~ Out” events change the opacities of elements as well as sliding them left-right (in and out of view). These are your adjustable timed controls.
So with these things in mind… Timer_Demo_JHSv1.hype.zip (15.9 KB)
When the mouse moves over a button (the “active” button) there is a “cover” element placed on the other button preventing it from firing any actions until the “mouse out” event occurs for the active button. Note that these covers use the “Display” property which shows or hides the “cover” element (not change their opacities).
When the “cover” element is shown over a button it prevents any assigned actions for that button from firing. When the “cover” element is hidden the button interacts with assigned “mouse over~out” actions.
In this demo I have given the “cover” element a light grey color to help You visualize how the process works. In actual use there would be no color assigned to the “cover” element.