Как создать всплывающее окно сверху тела, а не над телом

У меня на главной странице появляется всплывающее окно. Но проблема в том, что она появляется над телом или заголовком, где бы я ни находился в шаблоне. Но я хочу, чтобы он отображался с прозрачным фоном, накладывая содержимое. Вот как работает всплывающее окно. Но как мне это достичь?Как создать всплывающее окно сверху тела, а не над телом

home.tpl (Это где я играю вокруг размещения всплывающего окна)

<!DOCTYPE html> 
<html class="no-js" lang="en"> 
<head> 
<?php include($data['config']['THEME_DIR_INC'].'inc/meta_common.inc.php'); ?> 
<title> 
<?php include($data['config']['THEME_DIR_INC'].'inc/title.inc.php'); ?> 
</title> 
<?php include($data['config']['THEME_DIR_INC'].'inc/scripts_common.inc.php'); ?> 
</head> 
<body> 

<div id="wrapper"> 
    <?php include($data['config']['THEME_DIR_INC'].'inc/header.inc.php'); ?> 
    <?php #include($data['config']['THEME_DIR_INC'].'inc/nav_main.inc.php'); ?> 
    <div id="position_scroll"> 

     </div> 
    <div id="boxes"> 
<?php include($data['config']['THEME_DIR_INC'].'inc/promo.inc.php'); ?> 
    </div> 
    <div id="main"> 
    <?php require($this->view_location); ?> 

    </div> 
    <?php include($data['config']['THEME_DIR_INC'].'inc/footer.inc.php'); ?> 
</div> 
</body> 
</html>

Script

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script> 
<script type="text/javascript"> 
    var jpop=$.noConflict(true); 
jpop(document).ready(function() { 

     var id = '#dialog'; 

     //Get the screen height and width 
     var maskHeight = jpop(document).height(); 
     var maskWidth = jpop(window).width(); 

     //Set heigth and width to mask to fill up the whole screen 
     jpop('#mask').css({'width':maskWidth,'height':maskHeight}); 

     //transition effect  
     jpop('#mask').fadeIn(1000); 
     jpop('#mask').fadeTo("slow",0.8); 

     //Get the window height and width 
     var winH = $(window).height(); 
     var winW = $(window).width(); 

     //Set the popup window to center 
     jpop(id).css('top', winH/2-$(id).height()/2); 
     jpop(id).css('left', winW/2-$(id).width()/2); 

     //transition effect 
     jpop(id).fadeIn(2000); 

    //if close button is clicked 
    jpop('.window .close').click(function (e) { 
     //Cancel the link behavior 
     e.preventDefault(); 

     jpop('#mask').hide(); 
     jpop('.window').hide(); 
    });  

    //if mask is clicked 
    jpop('#mask').click(function() { 
     jpop(this).hide(); 
     jpop('.window').hide(); 
    });  

}); 

</script>

источник

2014-12-31 samantha

вы должны добавить CSS в коробках Див

div#boxes{ 
    position:fixed; 
    z-index: 99; /* so that the div stays on top of others */ 
    top: 50px; /* distance from the top */ 
    height: 400px; /*set as neccessary */ 
    width: 400px; /*set as neccessary */ 

    /* To center the box */ 
    margin-left: auto; 
    margin-right: auto; 
}

источник

2014-12-31 06:45:07 th1rdey3

Как создать всплывающее окно сверху тела, а не над телом

ответ

Смежные вопросы