Alert на весь экран

Как сделать всплывающее окно поверх всех и на всё окно? Сейчас только с боку выезжает. (таймаут оставить!).

  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
    <script src="http://code.jquery.com/ui/1.8.21/jquery-ui.min.js" type="text/javascript"></script>
    <script>
    $(document).ready(function() {
    setTimeout ("$('#popup').show('drop');", 1000);
    setTimeout ("$('#popup').hide('drop');", 4000);
    setTimeout ("$('#popup2').fadeIn('fast');", 6000);
    setTimeout ("$('#popup2').fadeOut('slow');", 9000);
    });
    </script>

     <div id='popup' style="display: none; background-color: pink; border: 1px solid lightblue; width: 450px; height: 450px; padding: 10px;"><h2>Привет</h2>Добрый день</div>

Ответы (1 шт):

Автор решения: Denis640Kb

Используйте абсолютно позиционирование. Пример:

    $(document).ready(function() {
        setTimeout ("$('#popup').show('drop');", 1000);
        setTimeout ("$('#popup').hide('drop');", 4000);
        setTimeout ("$('#popup2').fadeIn('fast');", 6000);
        setTimeout ("$('#popup2').fadeOut('slow');", 9000);
    });
    .popup{
        display: none;
        position: absolute;
        background-color: pink;
        border: 1px solid lightblue;
        top: 0;
        width: 100%;
        height: 100%;
        padding: 10px;
    }
    .bz {
        width: 1000px;
        background-color: #003eff;
    }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="bz">123</div>
<div class="bz">123</div>
<div class="bz">123</div>
<div class="bz">123</div>
<div class="bz">123</div>
<div class="bz">123</div>

<div id='popup' class="popup"><h2>Привет</h2>Добрый день</div>

→ Ссылка