Показать сообщение отдельно
  #7 (permalink)  
Старый 11.03.2013, 11:59
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Страшный попап.
<style> 
    #fs_popup_bg { 
        z-index:9999; 
        opacity:0.9; 
        left:0; 
        top:0; 
        position:fixed; 
        width:100%; 
        height:100%; 
        background:#000; 
    } 
    #fs_popup { 
        margin:10% 20%; 
        z-index:10000; 
        position:fixed; 
        width:600px; 
        border-radius: 25px; 
        border: 5px solid #FF0000; 
        height:300px; 
        background: #000080; 
        padding: 1px 10px 10px 10px; 
    } 
    .fs_content_left, .fs_content_right { 
        float: left; 
        padding: 5px: 
        font-size: 20px; 
        font-family: Arial; 
    } 
</style>
<div id='fs_popup_bg'> 
    <div id='fs_popup'> 
        <div class='fs_popup_head'> 
    </div> 
    <div class='fs_content'> 
        <div class='fs_content_left'> 
        </div> 
        <div class='fs_content_right'> 
        </div> 
    </div> 
</div>


Лучше подключить что-то типа jquery + fancybox:
<link rel="stylesheet" href="https://raw.github.com/fancyapps/fancyBox/master/source/jquery.fancybox.css" />

<div hidden>
<div id="popup-content">Тестовый контент для модального окна</div>
</div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://raw.github.com/fancyapps/fancyBox/master/source/jquery.fancybox.pack.js"></script>
<script>
    if (!sessionStorage.visited) {
        document.body.appendChild(document.createTextNode('Первый заход, через 3 секунды появится окно.'));
        setTimeout(function(){
            $.fancybox.open($('#popup-content'), {type: 'inline'});
            sessionStorage.setItem('visited', 1);
        }, 3000);
    } else {
        document.body.appendChild(document.createTextNode('Окно показано не будет в этот раз.'));
        sessionStorage.removeItem('visited');
    }
</script>
Ответить с цитированием