Здравствуйте, уважаемые дизайнеры! Проблема с модальным окном!
Вообщем суть проблемы такова:
Есть баннер, по середине.
Вот код:
Когда в html-block_bottomokno ставишь условия:
z-index:1; то он будет поверх всех других материалов, но проблема в том что когда закрываешь его все ровно центр экрана не кликабельная. То есть как будь-то все ещё баннер не закрыть и поэтому невозможно кликать по контенту.
В чем может быть проблема? Посмотрите пожалуйста, код!
Смотрите...Это всплывающее модальное окно, с кнопкой закрытия.
Если ты открываешь новую вкладку и набираешь название сайта то он открывается и ты закрывая его можешь в данной вкладке переходить сколько угодно по сайту на другие релизы, посты. Ну так вот я делаю так чтобы в середине был сам модальный окно с кнопкой закрытия. Все проходить, но одно но тут центр под размер 800х600 который мы фиксируем через див для модального окна под баннер, остается фиксированной после закрытия модального окна. Есть ли какое нибудь решение на CSS или можете например привести пример всплывающего модального окна с закрытием под размер 800х600. Чтобы внутрь окна был 800х600 с кнопкой закрытия.
Вообщем суть проблемы такова:
Есть баннер, по середине.
Вот код:
Код:
<div class="html-blockokno html-block_bottomokno">
<style>
.html-block_bottomokno{
width: 800px;
height: 550px;
text-align: center;
position:fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
z-index:1;
}
.html-blockokno{
display:inline-block;
text-align:center;
}
.banner-wrapper-1232131asa{
position:absolute;
}
.banner-close-1232131asa{
position:absolute;
top:-33px;
right:20px;
width:40px;
height:33px;
color:#fff;
font:30px/33px Arial,sans-serif;
text-align:center;
border-radius:5px 5px 0 0;
background:#002f5e;
cursor:pointer
}
.banner-link-1232131asa,.banner-image-1232131asa{
display:block;
}
@media (min-width: 1020px) {
.banner-image-1232131asa{
width:800px;
height:570px;
text-align: center;
background-image:url(/img/800x600.gif);
background-position:50% 50%;
background-repeat:no-repeat;
background-color:#212129
}
}
</style>
<div class="banner-wrapper-1232131asa" id="bannerNode1232131asa">
<span class="banner-close-1232131asa" id="closeNode1232131asa">×</span>
<a class="banner-link-1232131asa" target="blank" onclick="yaCounter42152454.reachGoal('1xbetclick'); return true;" href="http://refpaqqm.host/L?tag=s_103339m_14255c_d548_l1643_banner&site=103339&ad=14255" id="linkNode1232131asa">
<span class="banner-image-1232131asa"></span>
</a>
</div>
<script>
(function(){
var bannerNode=document.getElementById('bannerNode1232131asa');
var crossNode=document.getElementById('closeNode1232131asa');
var linkNode=document.getElementById('linkNode1232131asa');
if(sessionStorage.getItem('banner1232131asa')==='closed'){
bannerNode.innerHTML='';return
}else{
(function() {
var token = Math.random();
var code = document.createElement("script");
code.type = "text/javascript";
code.async = true;
code.src = "http://site.ru/";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(code, s);
})();
}
crossNode.addEventListener('click',function(){sessionStorage.setItem('banner1232131asa','closed');bannerNode.innerHTML=''})
})();
</script>
</div>
z-index:1; то он будет поверх всех других материалов, но проблема в том что когда закрываешь его все ровно центр экрана не кликабельная. То есть как будь-то все ещё баннер не закрыть и поэтому невозможно кликать по контенту.
В чем может быть проблема? Посмотрите пожалуйста, код!
Смотрите...Это всплывающее модальное окно, с кнопкой закрытия.
Если ты открываешь новую вкладку и набираешь название сайта то он открывается и ты закрывая его можешь в данной вкладке переходить сколько угодно по сайту на другие релизы, посты. Ну так вот я делаю так чтобы в середине был сам модальный окно с кнопкой закрытия. Все проходить, но одно но тут центр под размер 800х600 который мы фиксируем через див для модального окна под баннер, остается фиксированной после закрытия модального окна. Есть ли какое нибудь решение на CSS или можете например привести пример всплывающего модального окна с закрытием под размер 800х600. Чтобы внутрь окна был 800х600 с кнопкой закрытия.
Последнее редактирование модератором:

