Javascript всплывающее окно не отвечает?

Question

Я работал над масштабным проектом, и у меня были некоторые проблемы с javascript и CSS для создания всплывающего окна.Я надеялся, что смогу вызвать функцию javascript для отображения различных версий, но она не появлялась, если только она не была закрыта ...

Вот мой код:

<div  id='popup' style='display: hidden; background-color: white; padding: 2vw; position: fixed; top: 5%; right: 25%; z-index: 999; width: 50vw; height: auto; margin-left: 15; margin-right: 15; border-style: solid; border-color: #181818;'>
<a  class="sidebar" style="position:absolute; top:0 ;right: 1vw;font-size: 36px; margin-left: 50px;" #href="javascript:void(0)" class="closebtn" onclick="closePopUp()">&times;</a> <!-- The button which activates Javascript to close the pop up box -->
<img id='cookiepic' src='cookie.jpg' style='width: 3vw; height: 3vw; display: hidden;'>
<p class='spacedfont' style='display: inline' > &nbsp Oh, and by the way...</p>
<hr>
<div style='display: flex; flex-direction: row; display:hidden;' id='cookieinfo'>
<p id='cookiep'>
As is common practice with almost all professional websites this site uses cookies, which are tiny files that are downloaded to your computer, to improve your experience.
<br><br>This page describes what information they gather, how we use it and why we sometimes need to store these cookies.
<br><br>We will also share how you can prevent these cookies from being stored however this may downgrade or 'break' certain elements of the sites functionality.
<br><br>By closing this notice or continuing to use the page, you consent to our use of cookies.
</p>

</div>

<div style='display: flex; flex-direction: row; display:hidden;' id='aboutinfo'>
<p id='aboutp'>
We're a fresh business to the world of e-commerce that aims to bring you the best experience shopping online.
Our business is based in the UK but our web of business relationships stretches worldwide to deliver you the best service.
<br><br>Part of our ethos is innovation, a key role in our success which allows us to scour the globe for offers and deals to bring to you almost daily. Be sure to check the featured panel for a taster of what we've found recently!
<br><br>If you'd like to know anything else, email a member of our friendly team at xxxxx@gmail.com
</p>

</div>
</div>




<script>
function closePopUp() {
    document.getElementById("popup").style.display = "none";
    document.getElementById("cookieinfo").style.display = "none";
    document.getElementById("cookiepic").style.display = "none";
    document.getElementById("aboutinfo").style.display = "none";
}
function openPopUp() {
    document.getElementById("popup").style.display = "visible";

}
function showCookie() {
    document.getElementById("popup").style.display = "visible";
    document.getElementById("cookieinfo").style.display = "visible";
    document.getElementById("cookiepic").style.display = "inline";
}
function showAbout() {
    document.getElementById("popup").style.display = "visible";
    document.getElementById("aboutinfo").style.display = "visible";
}

closePopUp();
showAbout();
</script>

Мне бы понравилось, если бы кто-нибудь мог мне сказать, как исправить любую проблему с javascript или php, которую я здесь имею, чтобы разные версии открывались для разных функций и, возможно, даже демонстрировали код onClick на примере, чтобы доказать, что он работает?

:)

Answer 1

вы используете функцию автоматического вызова closePopUp ();поэтому при загрузке экрана не появляется