Flash-видео, все еще воспроизводимое на DIV, которое удаляется с помощью jQuery (ошибка IE) - PullRequest
14 голосов
/ 27 ноября 2009

У меня есть несколько вкладок jQuery, одна из которых содержит флэш-видео. Когда я воспроизводю видео на одной вкладке и нажимаю на другую в FF или Safari, видео останавливается вместе со звуком, при нажатии на вкладку видео происходит перезагрузка контента - как и ожидалось.

В Internet Explorer это не так, видео продолжает воспроизводиться, даже если вкладка не выбрана. Насколько я понимаю, когда display:none (jQuery hide ()) применяется элемент DOM по существу удаляется из макета - почему это не происходит с браузерами IE, как я могу это исправить?

Ответы [ 13 ]

22 голосов
/ 13 мая 2010

Чтобы удалить видео, а затем повторно добавить его, добавьте в свою функцию, которая закрывает окно видео, следующее:

 // Remove and re-add video
 var clone = $("#video-holder").clone(true);
 $("#video-holder").remove();
 $("#video").html(clone);

Где у вас есть окружающий div "video" и внутри div "video-holder", в котором находится код для встраивания.

6 голосов
/ 27 ноября 2009

Вы можете попытаться удалить элемент, когда вы вкладываете вкладку в элемент div, содержащий вспышку, например $("object").remove();

3 голосов
/ 24 марта 2012

Просто сделайте так, чтобы обновить:

var a = document.getElementById('div_movie').innerHTML;
document.getElementById('div_movie').innerHTML = a;
2 голосов
/ 15 декабря 2010

$ ( "# VideoContainer") HTML ( "");.

Казалось бы, правильный ответ, но если я дважды нажму на один и тот же элемент, он останется пустым.

1 голос
/ 28 ноября 2009

просто очистите контейнер видео следующим образом:

$ ( "# VideoContainer") HTML ( "");.

0 голосов
/ 02 июля 2014

Нет необходимости использовать JQuery, достаточно простого решения Javascript. Просто замените div игрока на клон самого себя:

oldVideoDiv = document.getElementById (videoId);

newVideoDiv = oldVideoDiv.cloneNode (true);

oldVideoDiv.parentNode.replaceChild (newVideoDiv, oldVideoDiv);

0 голосов
/ 07 ноября 2012

Мое решение, это должно работать:

$('#myVideoContainer object').remove();
0 голосов
/ 19 января 2012

У меня была такая же проблема со встроенным видео на YouTube. Это было окончательное решение, которое работало в IE, Firefox, Chrome и Safari:

Ниже приведены сценарий jQuery, HTML и CSS, используемые для решения проблемы IE, связанной с продолжением воспроизведения звука, когда встроенное видео YouTube скрыто.

Это скрипт jQuery (который я поместил непосредственно перед конечным тегом body):

<script type="text/javascript">
$(function() {

    $('.close').click(function() {

    // needed to find some way to remove video and then replace it because IE would close the div but continue to play sound


    $('iframe').hide();   // must hide the YouTube iframe first or closing it before playing will cause a black window in IE


    $('#video1').hide('fast');  // then hide the container div that has the video div that has the YouTube iframe in it

    var bringback = $("#tinleyvideo").clone(true);   //clone the div that has the YouTube iframe and assign it to a variable

    $("#tinleyvideo").remove(); // remove the div that has the YouTube iframe

    $("#video1").html(bringback);   // replace or recreate the div that has the YouTube iframe using the variable with cloned information
    });

    $('.tourism').click(function() {
        $('iframe').show();   // show the YouTube iframe                         
         $('#video1').show('fast');   // show the div that contains the YouTube video div
    });
}); 

Вот структура HTML. Тег ссылки с классом «туризм» - это ссылка на изображение, используемая для вызова всплывающего окна с видео. Тег div с идентификатором «Video1» представляет собой контейнерный блок для div с идентификатором «tinleyvideo», который содержит встроенный код YouTube. Тег ссылки с классом «close» скрывает видео с помощью jQuery.

<a href="#" class="tourism"><img src="images/home_video.jpg" width="217" height="161" border="0"/></a>


<div id="video1">
       <div id="tinleyvideo"><a href="#" class="close" style='float:left; color:white; padding-bottom:10px; font-size:12px;'>Close</a><br />
<iframe width="560" height="315" src="http://www.youtube.com/embed/XxnM7UzquSs?rel=0" frameborder="0" allowfullscreen></iframe>
    </div>
</div>

CSS (он позиционирует всплывающее окно, изначально не отображает его и добавляет другие пользовательские стили):

#video1  {
    position: absolute;
    top:240px;
    left:220px;
    width:560px;
    height:360px;
    display: none;
    -moz-border-radius: 10px; 
    padding: 10px; 
    background-color: #486A74; 
    border: 3px solid #DCC35C;
    z-index:400;
    }

Надеюсь, это поможет.

0 голосов
/ 26 ноября 2011

У нас была такая же проблема. Flash-видео было встроено с использованием swfobject.embedSWF (...), однако IE9 не останавливал видео, когда div был скрыт с помощью jquery.

Простой обходной путь: Снова вызовите swfobject.embedSWF (...), чтобы (повторно) загрузить swf в тот же целевой div.

Если у вас есть видео с автовоспроизведением, попробуйте загрузить другой пустой SWF-файл при скрытии. Приветствия

0 голосов
/ 09 февраля 2010
$("#flashContainer").empty() 

также сбросит код встраивания и остановит Flash

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...