Наложение звука в IE, когда я показываю / скрываю видео - PullRequest
1 голос
/ 23 ноября 2011

У меня есть список миниатюр со ссылками на отдельные видео. Все отлично работает во всех браузерах, кроме IE. В IE, если я запускаю видео и (без нажатия кнопки паузы или остановки) нажимаю на миниатюру для следующего видео, звук продолжает воспроизводиться. Другими словами, аудио для обоих видео воспроизводится одновременно. Какие-либо предложения?

HTML:

    <ul class="videoButtons">
    <li><a class="vidButton" href="javascript:void(0)" id="1" ><img src="images/videoPics/vid1Thumb.jpg" /><br />video title</a></li>
    <li><a class="vidButton" href="javascript:void(0)" id="2" ><img src="images/videoPics/vid2Thumb.jpg" /><br />video title</a></li>
    <li><a class="vidButton" href="javascript:void(0)" id="3" ><img src="images/videoPics/vid3Thumb.jpg" /><br />video title</a></li>
    </ul>

<div class="box" id="video1">
     <!--flv embedded object - FLVPlayer-->
</div>
<div class="box" id="video2">
    <!--flv embedded object - FLVPlayer1-->
</div>
<div class="box" id="video3">
     <!--flv embedded object - FLVPlayer2-->
</div>

Показать / Скрыть код:

$(".vidButton").click(function()
{
var buttonID = $(this).attr('id'); // get ID of the button clicked
var video = $('#'+'video'+buttonID); // add ID number to video
$('.box').hide(); // hide all other divs
video.fadeTo("slow", 1); // show video
});
});
// video objects
swfobject.registerObject("FLVPlayer");
swfobject.registerObject("FLVPlayer1");
swfobject.registerObject("FLVPlayer2");

1 Ответ

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

Вместо загрузки всех разных проигрывателей в фоновом режиме, рассмотрите возможность загрузки одного проигрывателя и, если доступно, используйте команды API для загрузки видео с другого URL в этом случае. Если API не используется, вы, вероятно, захотите динамически добавить / удалить соответствующий объект в DOM браузера.

Пример кода ( для последнего варианта ) :

$(".vidButton").click(function()
{
    if ($('#video_container embed').length() > 0) $('#video_container embed').remove(); // remove an existing player from the DOM if it exists

    var buttonID = $(this).attr('id'); // get ID of the button clicked
    var dyn_object = document.createElement("embed"); // create a dynamic HTML embed object
    $(dyn_object).appendTo($('#video_container')); // append the object to the DOM before doing anything to avoid potential memory leaks
    $(dyn_object).attr("type", "application/x-shockwave-flash");
    $(dyn_object).attr("src", "http://www.website.com/player.swf");
    $(dyn_object).attr("flashvars", "file=http://www.website.com/movies/movie_" + buttonID + ".flv");
    // ... optionally add more attributes here
});
...