There are pseudo-classes ( :-webkit-autofill , etc.) for selecting inputs that were autocomplete, but is there a selector or some other solution to detect when the browser autocomplete drop-down list is expanded?
I was hoping that I could change the location of my own autocomplete dropdown when the browser offers autocomplete, because otherwise they overlap, i.e. put my own autocomplete list above the input when browser autocomplete is open, but otherwise it will be shown below the item.
I know that I can completely disable autocomplete, but I would prefer. Is my only other option just to have my own autocomplete always over an element?
This question has been proposed as a duplicate. This question asks: "How do you know if the browser automatically populated a text box?" while my question is: "How do you know when a browser drop-down is displayed?" None of the answers give a solution to my question.
Since my intention seems a little difficult to explain, here is a picture of what I mean:

What I'm trying to do is determine if the autofill window will open, i.e. a box with blurry text, currently open or not. All suggested answers relate to detecting when the user actually selected (or hangs) something in the list.
In the situation shown in the image where the drop-down menu is open but nothing is selected, polling for pseudo-selectors returns nothing.
javascript html css
Schlaus
source share