как воспроизвести видео html5 без использования автозапуска, потому что он буферизирует ВСЕ и действительно замедляет загрузку страницы - PullRequest
0 голосов
/ 19 июля 2010

Пример кода приведен в конце поста для справки.

Извините за то, что я так долго скучал, просто пытался пройти и не оставлял возможностиинформация вышла.

Похоже, я нарисовал себя в каком-то уголке.У меня есть функция переключения показа скрытия, которая, кажется, работает нормально.У меня есть небольшая армия DIV, каждый из которых отображается и скрывается при нажатии на пункты меню.Это видео галерея.Кнопки находятся в JQuery-скрипте и находятся в списке html.CSS используется с идентификаторами Div

Функция и скрытие всего отлично работает.Это кажется стратегическим вопросом, поскольку, если я хочу, чтобы соответствующее видео начало воспроизводиться, когда показывается div, я удаляю preload = "none", когда загружаю эту страницу, ВСЕ 32 видео оказываются в верхней части буферизующимися, и это УБИВАЕТ время загрузки страницы.Когда для предварительной загрузки установлено значение none, видео находится там, готовое к воспроизведению после того, как кто-то нажимает соответствующую кнопку, чтобы показать его.Я и мои клиенты ожидаем, что фильм начнет воспроизводиться, как только появится окно.На самом деле, как только появляется окно и на видео появляется надпись «загрузка», все, что мне нужно сделать, это нажать «play», и он начинает плавно воспроизводиться.Итак, без использования автозапуска, есть ли способ заставить видео воспроизводиться, когда нажата кнопка, чтобы скрыть соответствующий div?

Кстати, я использую Видео для всех в качестве базы, но это не таккажется, предлагают решение для более чем пары видео.

Возможно, мой формат видео неправильный, но я использую видео h264, сохраненное из quicktime pro в расширении .m4v.Я также пытаюсь выяснить, может ли формат воспроизводиться автоматически, но я знаю, что OGV не может, так что я не очень надеюсь на это.Кроме того, я добавлю флэш-запасной вариант.

Пожалуйста, будьте любезны с моим кодом, потому что я всего лишь аниматор и ничего об этом не знаю.Кроме того, похоже, что моя функция show hide усекается зрителем.Он там и работает отлично, правда.

<script>
<!-----Javascript----->

function hideAll(){
tag = document.getElementsByTagName("div");
 for(x=0;x<tag.length; x++){
 //alert(tag[x].getAttribute('id'));
 if(tag[x].getAttribute('id').indexOf("hide") != -1){
 //alert(tag[x].getAttribute('id'));
 tag[x].style.display = "none";
 }
 }
}

function show(id){
el = document.getElementById(id);
 if(el.style.display == "none"){
  hideAll();
  el.style.display = "block";
 }
 else {
  el.style.display = "none";
  document.getElementById('hide').style.display = "";
 }
}
</script>

<!-----The list of buttons inside of the div slider----->
  <li>
               <div id="MenuGroup">
    <div id="MoviePicL1">
     <span style="cursor:pointer" onClick="show('hide1')"><img src="images/Posters/Movie1image"></span>        </div>
      <div id="MoviePicL2">
     <span style="cursor:pointer" onClick="show('hide2')"><img src="images/Posters/Movie2image"></span>      </div>
      <div id="MoviePicL3">
     <span style="cursor:pointer" onClick="show('hide3')"><img src="images/Posters/Movie3image"></span>      </div>
   </div>
  </li>

Вот что они переключают:

<div id="hide2" style="display:none;">  
       <div id="VideoContainerDiv" class="mybox"> 
            <video id="Movie1_Reel" width="580" height="326" controls preload="none">
          <source src="Videos/movie1_Reel" type="video/ogg"></source>
             <source src="Videos/movie1_Reel" type="video/mp4"></source>
         </video>
       </div>
    </div>
</div> 

Ответы [ 2 ]

0 голосов
/ 20 июля 2010

В Webkit есть известная ошибка, из-за которой видео автоматически буферизуется, даже если autobuffer не установлено.В настоящее время это исправлено в ночных сессиях Safari (и может быть исправлено в Chrome, не совсем понятно).

Что вы можете сделать, чтобы отрицать это, - создать состояние «по умолчанию» для вашего игрока.Не создавайте физически элемент <video>, пока вы не захотите начать буферизацию видеофайла.Например, у вас может быть снимок экрана с видео с помощью кнопки воспроизведения (некоторые простые изображения и CSS).При нажатии изображения будут заменены с помощью JS с элементом <video>.

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

0 голосов
/ 19 июля 2010

Ну, вы можете вызвать play () для видеообъекта, когда он отображается.

http://www.whatwg.org/specs/web-apps/current-work/multipage/video.html#playing-the-media-resource

...