Dropdown does not close on mobile due to missing hover event

[schorsch]

Such only occurs on multi-select dropdowns which do not closeOnSelect.

1. when the mouse hovers over an input the hover class is set on the wrapping element.
2. select multiple elements from the dropdown
3. leave the field (e.g. click somewhere else) the hover class is removed and the blur event is fired (mouseleave event)
4. the blur event checks if the wrapper element has a hover class and if NOT it closes the dropdown => this is where it has probs on mobile because the hover class is still set and there is no way to remove it with the current mouse-event handling (mouseleave)

Since all events are bound to the element i have no clue how to handle such on mobiles, where no event is fired when i tap outside of the element. In the old jquery version there was a transparent background div which would catch such clicks and remove the dropdowns.

Some ideas i currently have, which are all not too appealing.

• write a complete mobile friendly dropdown (class or just template) which pops up in fullscreen with an input on top, so the user sees what he is typing, and a close link.
• remove all instances of selectivity-dropdown before opening the dropdown, to allow only a single being opened
• have an external listener to check for x,y postions to detect clicks outside of current select