Скрытый вариант выбора элемента оставить «черный» фон

Question

Я не могу понять, почему в приведенном ниже коде есть черный прямоугольник, насколько я могу сказать, это что-то, оставленное скрытым параметром, но я понятия не имею, как это скрыть или измените его цвет.

Что это такое и как мы им манипулируем?

<div>
  <select>
    <option hidden>Select flow slides</option>
  </select>
</div>

Вот кодовая ссылка, по которой вы можете увидеть, как это происходит: https://codepen.io/Nick09/pen/NWGmJGy

И ссылка с загадочным прямоугольником, который появляется при нажатии на элемент выбора : https://imgur.com/9rdbXkS

Дополнительные примеры изображений: https://imgur.com/a/MhYNPy8

Обновление: после того, как кто-то в комментариях что-то предложил, я понял, что проблема намного проще, чем я думал. В основном, всякий раз, когда вы нажимаете выберите без каких-либо параметров, вы получаете этот маленький черный раскрывающийся список: https://imgur.com/ZfFn5DN.

Answer 1

Итак, после некоторого времени, вложенного в это, и довольно небольшой помощи со стороны сообщества мне удалось найти исправление.

Поскольку проблема сводится к следующему: на некоторых машинах кажется (удалось чтобы воспроизвести его на чужом ПК / Windows), что элемент select без каких-либо параметров вызовет черный выпадающий список при нажатии мыши.

И вам нужно a select element без параметров по разным причинам, в моем случае это было потому, что я позже удалял то, что было внутри вышеупомянутого select element , чтобы добавить настраиваемый раскрывающийся список.

Затем все, что вам нужно сделать, это добавить прослушиватель событий, который прослушивает событие onmousedown и выполнять e.preventDefault() на нем, чтобы раскрывающийся список по умолчанию вообще не открывался.

Проверено во всех браузерах без проблем!

Конечный результат: https://imgur.com/moYaFkO

Спасибо за ваши предложения, ребята!

Answer 2

Используйте атрибут style, чтобы скрыть весь параметр.

<option style="display:none">Select flow slides</option>

Или используйте атрибут disabled, чтобы отключить параметр (удалить скрытый атрибут)

<option disabled>Select flow slides</option>