how to make an animation of a modal window that it crawled out from the left edge of the screen

Closed due to the fact that off-topic participants Stepan Kasyanenko , 0xdb , Air , freim , Dmitry Kozlov February 9 at 9:33 .

It seems that this question does not correspond to the subject of the site. Those who voted to close it indicated the following reasons:

  • “Questions asking for help with debugging (“ why does this code not work? ”) Should include the desired behavior, a specific problem or error, and a minimum code for playing it right in the question . Questions without an explicit description of the problem are useless for other visitors. See How to create minimal, self-sufficient and reproducible example . " - Air, Dmitry Kozlov
  • " Learning tasks are allowed as questions only on condition that you tried to solve them yourself before asking a question . Please edit the question and indicate what caused you difficulties in solving the problem. For example, give the code you wrote, trying to solve the problem "- Stepan Kasyanenko, freim
If the question can be reformulated according to the rules set out in the certificate , edit it .

    1 answer 1

    Example

    var btn = document.querySelector('.btn'); var modal = document.querySelector('.modal'); btn.addEventListener('click', function() { modal.classList.toggle('open'); }); 
     * { padding: 0; margin: 0; box-sizing: border-box; } .modal { position: fixed; top: 30%; left: 50%; background: #ccc; padding: 2em; transform: translateX(-1000%); transition: transform 1s ease; z-index: 999; } .modal.open { transform: translateX(-50%); } 
     <button class="btn">Open modal</button> <div class="modal">Modal</div>