Stack Overflow
Stack Overflow

Can a
` element with only CSS. There are JS options like this [SO answer](https://stackoverflow.com/a/60407758/7216508) if you must. For accessibility concerns, I wouldn't recommend using `div` and a `button` as in your snippet. – Bumhan Yu Feb 26 '23 at 06:28

  • Does this answer your question? [How can you programmatically tell an HTML SELECT to drop down (for example, due to mouseover)?](https://stackoverflow.com/questions/249192/how-can-you-programmatically-tell-an-html-select-to-drop-down-for-example-due) – blurfus Feb 26 '23 at 06:37
  • @blurfus No, those apparently all either no longer work or rely on Javascript. – Witness Protection ID 44583292 Feb 26 '23 at 07:39

    • 1 Answers1

    0

    Not sure about CSS but you can do this by using simple JavaScript.

    Here's a example from your code:

    <select
      name="field"
      id="field"
      onClick="clicked()"
      onmouseenter="expand(this)"
      onmouseleave="shrink(this)"
    >
      <option value="Field1" onclick="clicked()">Field1</option>
      <option value="Field2" onclick="clicked()">Field2</option>
      <option value="Field3" onclick="clicked()">Field3</option>
    </select>

    <script>
      function expand(obj) {
        obj.size = 3;
      }
      function shrink(obj) {
        obj.size = 1;
      }
      function clicked() {
        obj = document.getElementById("field");
        obj.size = 1;
      }
    </script>
    Mehedi
    • 16
    • 1