Всем привет,
Используя bootstrap-video-player(https://github.com/html5-ninja/Bootstrap-video-player-jQuery-plugin) выводится видео вроде
CODE ( htmlphp):
скопировать код в буфер обмена
<div class="videoUiWrapper thumbnail "> <video width="720" height="480" id="show_video"> <source src="
http://local-wprods.com/uploads/products/-product-71/C1kkZf3sFuS.mp4" type="video/odd"> <source src="http://local-wprods.com/uploads/products/-product-71/C1kkZf3sFuS.mp4" type="video/mp4"> Your browser does not support the video tag. </video><div class="videoController show_video" style="width: 720px;"><div class="progress progress-striped active" style="cursor:pointer"><div class="bar progressBar" style="width: 0%;"></div><div class="bar bufferBar" style="width: 58.9847%; opacity: 0.5;"></div></div><a href="#" class="playMedia"><i class="icon-play icon-white"></i></a><h6 class="timer">00:00 / 01:27</h6><i class="mute icon-white icon-volume-down"></i><ul class="volumeMedia unstyled"><li class="on"></li><li class="on"></li><li class="on"></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><ul></ul></ul><i class="fullscreen icon-fullscreen icon-white"></i></div> </div>
В данном случае размеры видео заданы из настроек видео ''720*480''
Но как лучше задать чтобы на разных устройстах максимальная ширина была ограничена и не вылазила по ширине ?
В таких случаям часто для бордюра выводится класс, для которого меняется max-width в стилях, которые различны для разных устройств.
Но как это слвместить с шириной видео ?
Спасибо!
|