Как сделать, чтобы при нажатии на кнопку всплывал список?

Для того чтобы при нажатии на кнопку всплывал список, вам понадобится использовать JavaScript, а точнее обработчик событий и CSS. Вот шаги, которые помогут вам реализовать данный функционал:

1. HTML разметка:

   <button id="button">Нажми меня</button>
   <ul id="list" class="hidden">
     <li>Элемент списка 1</li>
     <li>Элемент списка 2</li>
     <li>Элемент списка 3</li>
   </ul>

2. CSS стили:

   .hidden {
     display: none;
   }

3. JavaScript код:

   // Получаем ссылки на элементы кнопки и списка
   const button = document.getElementById('button');
   const list = document.getElementById('list');

   // Добавляем обработчик события на кнопку
   button.addEventListener('click', () => {
     // Проверяем, скрыт ли список
     const isListHidden = list.classList.contains('hidden');
     if (isListHidden) {
       // Если список скрыт, то удаляем класс hidden и показываем список
       list.classList.remove('hidden');
     } else {
       // Если список отображается, то добавляем класс hidden и скрываем список
       list.classList.add('hidden');
     }
   });

Суть решения заключается в следующем: при нажатии на кнопку, обработчик события с помощью метода classList.contains() проверяет, скрыт ли список (для этого у списка есть CSS класс "hidden"). Если список скрыт, обработчик удаляет этот класс и список становится видимым. Если список уже отображается, то обработчик добавляет класс "hidden" и скрывает список.

Однако, этот код представляет очень простой пример всплывающего списка. Вы можете его доработать в соответствии с вашими потребностями, например, добавить анимации или дополнительные функции, такие как обработка выбора элемента списка.