Как сделать так, чтобы моя модальная форма всплывала при загрузке страницы с задержкой по таймеру

Question

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

Я не могу получить форму всплывающего окна, хотя. Что я делаю неправильно?

таймер

setTimeout(popup, 10000); // Setting time 3s to popup login form
function popup() {
    $("#openModal").css("display", "block");
}

Всплывающая форма

<div id="openModal">
    <a href="#x" class="overlay" ></a>
    <div class="popup">
        <h2>Just Stopping By</h2>
        <p>Please enter your details here</p>
        <div>
            <label for="firstname">First Name:</label>
            <input type="text" id="firstname" value="" placeholder="First Name*" />
        </div>
        <div>
            <label for="lastname">Last Name:</label>
            <input type="text" id="lastname" value="" placeholder="Last Name*" />
        </div>
        <div>
            <label for="email">Email:</label>
            <input type="text" id="email" value="" placeholder="Email Address*" />
        </div>
        <div>
            <label for="phone">Phone:</label>
            <input type="text" id="phone" value="" placeholder="Phone Number*" />
        </div>
        <center><input class="button-primary" type="button" value="Submit!" /></center>
        <a class="close" href="#close"></a>
    </div>
</div>

Answer 1

Вы должны использовать setTimeout, когда dom готов:

$(function(){//document ready event
   setTimeout(function(){
        $("#openModal").show();
   },3000);//set interval to 3 second
});