Doesn't show model window

As planned, the model window should appear from the corner, and disappear, like a mouse not on an element of the model window, but my window just appeared, but after adding the condition, if nothing works,

 <div id="enterModal"><img src="/img/open.png" width="15px" height="15px">Войти</div>
                <div id="showModal">
                    <a href="/pablic/login.php">Log In</a>
                    <a href="/pablic/signup.php">Sign Up</a>


position: relative;
    display: none;
    width: 300px;
    height: 300px;
    background: rgb(252, 254, 252);
    position: absolute;
    right: 0;
    top: -10px;
    z-index: 99999;
    box-shadow: 0 0 15px gray;
    border-radius: 10px;
    transform: scale(0);
    transition: .5s;
  display: grid;
    height: 40px;
    width: 90px;
    background: black;
    border-radius: 5px;
    color: white;
    justify-items: center;
    align-items: center;
    margin: 0 auto;
    margin-top: 30px;


 enterModal.onclick = function () { = "block"; = "scale(1)";
        if (showModal.onmouseover != showModal) {
   = "none";
const enterModal = document.querySelector('#enterModal'),
				      showModal = document.querySelector('#showModal');
		enterModal.addEventListener( 'click', function(){
 = 'block';
 = 'scale(1)';
           showModal.addEventListener( 'mouseleave', function(){ = 'none'; }  );

СТОЛЬКО оказывается много кода нужно писать что бы просто вывести окно и закрыть его,пипец как сложно оказывается)))

Condition seems to always evaluate in true. Because of that = "none"; is executed in call cases hiding the dialog. See how that works in the fiddle Edit fiddle - JSFiddle - Code Playground.

I assume you accidentaly used same variable name showModal for 2 data points:

  • reference to the DOM node
  • flag indicating is modal should be shown

На эту запись поступили жалобы от сообщества, поэтому она временно скрыта.