2016-04-21 2 views
0

У меня возникли проблемы с отображением моих видеотегов на странице.Видеотеки не отображаются на странице

Я знаю, что я правильно их назову, потому что, если я перейду на localhost: 5000/vid/clip1.mp4 (прямая ссылка: http://blue-goji.herokuapp.com/vid/clip1.mp4), он показывает элементы управления видео, но он не будет играть ничего.

Может ли кто-нибудь сказать мне, что здесь происходит?

отношение HTML:

<div class='container' id='video-grid'> 
    <div class='wrapper'> 
     <video class='grid-vid' src='vid/clip1.mp4'>Not Supported</video> 
    </div> <!-- wrapper --> 
    <div class='wrapper'> 
     <video class='grid-vid' src='vid/clip2.mp4'>Not Supported</video> 
    </div> <!-- wrapper --> 
    <div class='wrapper'> 
     <video class='grid-vid' src='vid/clip2.mp4'>Not Supported</video> 
    </div> <!-- wrapper --> 
    <div class='wrapper'> 
     <video class='grid-vid' src='vid/clip3.mp4'>Not Supported</video> 
    </div> <!-- wrapper --> 
    <div class='wrapper'> 
     <video class='grid-vid' src='vid/clip4.mp4'>Not Supported</video> 
    </div> <!-- wrapper --> 
    <div class='wrapper'> 
     <video class='grid-vid' src='vid/clip4.mp4'>Not Supported</video> 
    </div> <!-- wrapper --> 
</div> <!-- container --> 

живая ссылка: http://blue-goji.herokuapp.com/

+0

Я пошел в прямую ссылку и смог увидеть видео-теги в DOM. – metarmask

+0

Простите, может быть, я не хотел появляться на странице. Если вы проверяете пустую белую область под навигационной панелью, я вижу видеотеки, показанные в источнике/DOM. но они не отображаются на странице ... есть просто большое пустое пространство, куда они должны идти. – Casey

+0

Я пошел в инспектор и заменил атрибут src ссылкой на видео с внешнего сайта, и элемент стал видимым, проблема, похоже, связана с сервером или видео. – metarmask

ответ

1

видео элемент показывает вверх на странице, он просто сливается с фоном, потому что это тот же самый цвет. Существует проблема с видео-файлом или сервером, на котором он находится.

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

video { 
    background: gray; 
} 
Смежные вопросы