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

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

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

Ответы

Ответ 1

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

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

Если у вас есть окружающий "видео" div и внутри div-видео-владельца, в котором размещается код для встраивания.

Ответ 2

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

Ответ 3

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

var a = document.getElementById('div_movie').innerHTML;
document.getElementById('div_movie').innerHTML = a;

Ответ 4

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

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

Ответ 5

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

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

Ответ 6

Вероятно, потому, что вы применяете display: none; к элементу, содержащему объект flash, а не к самому объекту вспышки.

Я сегодня возился с подобной проблемой, и пока у меня нет точного решения, у меня есть возможность попробовать, когда вы прыгаете между div, чтобы попытаться отключить плеер:

$(flashobjectid).attr('height', '0');

Если используемый флеш-плеер является обычно используемым jw-плеером, то вы можете сделать (когда вы спрячете div):

document.getElementById(playerId).sendEvent("PLAY","false"); 

Ответ 7

Вам может потребоваться запрограммировать функцию player.stop или player.pause для проигрывателя в событии onBlur на странице.

Ответ 8

Самая полезная вещь, которую вы могли бы сделать, это запись, которую вы используете. Youtube и Brightcove имеют Javascript API, которые вы можете использовать для управления проигрывателем. Как говорит tahdhaze, лучше всего было бы остановить игрока на событии window.onBlur и начать его снова, когда он получит фокус.

Использование CSS для прекращения воспроизведения видео в лучшем случае сложнее, а в худшем случае взломать... используйте API-интерфейс Flash-Javascript, который поставляется вместе с проигрывателем.

Ответ 9

$("#flashContainer").empty() 

также будет скрывать код вставки и останавливать Flash

Ответ 10


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

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

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

Ответ 11

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

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

Это jQuery script (который я разместил непосредственно перед тегом body 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 для div с идентификатором "tinleyvideo", который содержит встроенный в YouTube код iframe. Тег link с классом "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;
    }

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

Ответ 12

Мое решение. Это должно работать:

$('#myVideoContainer object').remove();

Ответ 13

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

oldVideoDiv = document.getElementById(videoId);

newVideoDiv = oldVideoDiv.cloneNode(true);

oldVideoDiv.parentNode.replaceChild(newVideoDiv, oldVideoDiv);