Файл: html/system/test/test.html
Строк: 85
<?php
<html>
<head>
<title>test</title>
<meta charset="UTF-8" />
<link href='http://fonts.googleapis.com/css?family=Roboto:100,400,300,500,700' rel='stylesheet' type='text/css'>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<style>
.fond {
position:absolute;
padding-top:45px;
top:0;
left:0;
right:0;
bottom:0;
background-color:#f8b334;
}
.mymagicoverbox {
display:inline-block;
color:#ffffff;
padding:10px;
margin:10px;
cursor:pointer;
font-weight:300;
font-family:'Roboto';
}
.mymagicoverbox_fenetre {
z-index:9999;
position:fixed;
margin-left:50%;
top:100px;
text-align:center;
display:none;
padding:5px;
background-color:#ffffff;
color:#97BF0D;
font-style:normal;
font-size:20px;
font-weight:300;
font-family:'Roboto';
}
.mymagicoverbox_fenetreinterieur {
text-align:center;
overflow:auto;
padding:10px;
background-color:#ffffff;
color:#666666;
font-weight:400;
font-family:'Roboto';
font-size:17px;
border-top:1px solid #e7e7e7;
margin-top:10px
}
.mymagicoverbox_fermer {
color:#CB2025;
cursor:pointer;
font-weight:400;
font-size:14px;
font-style:normal;
font-family:'Roboto';
}
#myfond_gris {
display: none;
background-color:#000000;
opacity:0.7;
width:100%;
height:100%;
z-index:9998;
position:fixed;
top:0;
bottom:0;
right:0;
left:0;
}
</style>
<div align="center" class="fond">
<div id="myfond_gris" opendiv=""></div>
<div align="center" style="padding-top:35px;">
<div style="background-color:#00a096;" iddiv="box_1" class="mymagicoverbox">
Нажми на меня !
</div>
</div>
<div id="box_1" class="mymagicoverbox_fenetre" style="left:-225px; width:450px;">
Заглавие модального окна!
<div class="mymagicoverbox_fenetreinterieur" style="height:150px; ">
<div align="center">
<br>Куплен предмет<br>
<div style="width:100px" align="center" class="mymagicoverbox_fermer">Ок</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function () {
$(".mymagicoverbox").click(function (){
$('#myfond_gris').fadeIn(300);
var iddiv = $(this).attr("iddiv");
$('#' + iddiv).fadeIn(300);
$('#myfond_gris').attr('opendiv', iddiv);
return false;
});
$('#myfond_gris, .mymagicoverbox_fermer').click(function (){
var iddiv = $("#myfond_gris").attr('opendiv');
$('#myfond_gris').fadeOut(300);
$('#' + iddiv).fadeOut(300);
});
});
</script>
</body>
</html>
?>