Не появляется popup
Не пойму почему один background проявляется
До - https://skr.sh/sOpcOcuJITn После - https://skr.sh/sOpaSdVX8sH <div class="popup__button circle-5"> <a href="#" id="popup"> <button class="home-btn circle-6"> Записаться на ознакомительный вебинар </button> </a> </div> </div> <div class="popup" id="popup"> <div class="popup__body"> <div class="popup__content"> <h3 class="popup__title"><span>Записаться</span> на ознакомительный вебинар</h3> <div class="popup__subtitle">К сожалению мы не проводим обучение</div> </div> </div> </div> .popup { position: fixed; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); top: 0; left: 0; z-index: 3000; overflow: auto; visibility: hidden; opacity: 0; } .popup.open { opacity: 1; visibility: visible; } .popup__body { align-items: center; display: flex; justify-content: center; min-height: 100%; align-items: center; } .popup__content { background: linear-gradient(286.41deg, #033958 3.63%, #0F6B78 90.98%); box-shadow: 0px 20px 50px rgba(0, 0, 0, 0.53); border-radius: 20px; max-width: 590px; padding: 65px 85px; position: relative; } .popup__title { span { color: #00E0FF; } width: 428px; font-size: 33px; line-height: 40px; color: #fff; text-transform: uppercase; margin-bottom: 23px; } .popup__subtitle { color: #fff; font-weight: 450; font-size: 18px; } const popup = document.querySelector('.popup') const openPopup = document.querySelector('.popup__button') const popupOpen = () => { popup.classList.add('open') } openPopup.addEventListener('click', popupOpen) |
Часовой пояс GMT +3, время: 03:29. |