Hi all,
i have the following issue: I'm trying to build a full page mega menu. The main idea is that i create 4 columns and when a mouseenter event occurs to any column i change the width of the entered column to 51% and i shrink the other 3 columns to 17%.
I run through an array of the columns and if the column is active i attach a timeline. If it is not active i attach a second one resetting it to initial values. (i am not very sure that this is the best practice, but that's what i came up, any suggestions are welcome).
When the resizing happens i show the content of the selected column, or hide it in case it is not active. The issue appears when i move the mouse quickly so probably the resetting timeline is not over yet when the new timeline starts. I tried killing tweens before i apply a new one but this obviously doesn't solve anything.
I'm feeling a little stuck, can you advise please?
(sorry for the messy css, the problem is in the js anyway)