Видео с iframe в модальном окне после закрытия не останавливаеться. Если ставишь старый код через object - закрываеться, но при этом ослик не воспроизводит.
Код модального окна:
<a href="#?w=790" rel="popup2" class="poplight"><img src="img/reviews/review2.png" alt=""/></a>
<div id="popup2" сlass="popup_block">
<center>
<iframe width="790" height="440" src="http://www.youtube.com/embed/5zzSKGveU8U" allowfullscreen></iframe>
</center>
</div>
CSS: #fade {
display: none;
background: rgba(0, 0, 0, 0.9);
position: fixed; left: 0; top: 0;
width: 100%;
height: 100%;
opacity: .80;
z-index: 9999;
}
.popup_block{
display: none;
background: #fff;
padding: 50px 65px 50px 50px;
float: left;
position: fixed; top: 50%; left: 50%;
color: #000;
z-index: 99999;
border-radius: 6px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
background: #fff;
-moz-box-shadow: 0 0 20px 2px;
-webkit-box-shadow: 0 0 20px 2px;
}
.close {
position: absolute; top: 13px; left: 860px;
width: 36px;
height: 36px;
font: 22px/1.7 "Trebuchet MS";
text-transform: uppercase;
text-decoration: none;
color: #fff;
cursor: pointer;
background: #2E79BA;
z-index: 100;
border: none;
border-radius: 18px;
-moz-border-radius: 18px;
-webkit-border-radius: 18px;
}
.close span{
position: relative; top: 0; left: 12px;
}
.close:hover {
background: #f00;
}
JS:
$(document).ready(function(){
//При нажатии на ссылку с классом poplight и href с a #
$('a.poplight[href^=#]').click(function() {
var popID = $(this).attr('rel'); //Получить имя popup
var popURL = $(this).attr('href'); //Определить размер popup из href
//Запрос и Переменные из HREF URL
var query= popURL.split('?');
var dim= query[1].split('&');
var popWidth = dim[0].split('=')[1]; //Возвращает первое значение строки запроса
// Добавить кнопку "Закрыть" в наше окно, прописываете прямой путь к картинке
$('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close" title="Закрыть"><span>X</span></a>');
//Определяет запас на выравнивание по центру (по вертикали по горизонтали)мы добавим 80px к высоте / ширине, значение полей вокруг содержимого (padding) и ширину границы устанавливаем в CSS
var popMargTop = ($('#' + popID).height() + 80) / 2;
var popMargLeft = ($('#' + popID).width() + 80) / 2;
//Применяем отступы в всплывающем окне
$('#' + popID).css({
'margin-top' : -popMargTop,
'margin-left' : -popMargLeft
});
//Фон слоя затемнения
$('body').append('<div id="fade"></div>'); //Добавляем слой затемнения.
$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Постепенное исчезание слоя - .css({'filter' : 'alpha(opacity=80)'}) используется для фиксации в IE, фильтр для устранения бага тупого IE
return false;
});
//Закрыть всплывающее окно и слой затемнения
$('a.close, #fade').live('click', function() { //При нажатии рядом, окно и слой затемнения закрываются
$('#fade , .popup_block').fadeOut(function() {
$('#fade, a.close').remove();
});
return false;
});
});
Подскажите как решить эту проблему?