I am trying to change the behaviour of an element on my page when the screen is resized.
I have a left navigation menu that is open at max screen width of say 1200px but when the window is resized below 1200px I would like the left navigation to be closed and only open when hovered (like Amazons menu).
I have both elements setup and ready to go. For the normal navigation I have a css class of ".dropdown open" and for the closed hover menu I have a css class of ".dropdown"
Is there a way to use jQuery to swap the classes when the window is resized?
I'd appreciate some advice on how to do this please....