Как сделать так, чтобы плеер не выходил за пределы экрана?

голоса: 0

Вставил видеоплеер (videoJS) на сайт. Как сделать чтоб при уменьшение окна браузера самого не вылазил за рамки дизайна. Ниже на картинке примеры как вылазиет.

Так выглядит если на весь экран браузер.

А так выглядит если уменьшит окно браузера.

Как решить данну проблему?

Закрыто с пометкой: Ответ получен!
| Автор: | Категория: Дизайн сайта
Закрыт | | Автор: Yuri_Geruk

Ответов: 1

Голоса: +1
 
Лучший ответ
Уточните ссылку на сайт, страницу где можно увидеть проблему, после будем смотреть как вам помочь.
| Автор:
Выбор ответа лучшим | | Автор: Александр Боровиков
Александр Боровиков,
Предоставьте шаблона страницы комментариев где у вас установлен плеер. Если кода много, можете закинуть в гугл документы и поделиться ссылкой на расшаренный файл.
Александр Боровиков,

Удалите с шаблона это:

<head>
 <link href="http://kinonet.at.ua/pleer/video-js.css" rel="stylesheet">

 <!-- If you'd like to support IE8 -->
 <script src="http://kinonet.at.ua/pleer/videojs-ie8.min.js"></script>
</head>

и добавьте в текущий блок <head>сюда</head> код:

 <link href="http://kinonet.at.ua/pleer/video-js.css" rel="stylesheet">
 <script src="http://kinonet.at.ua/pleer/videojs-ie8.min.js"></script>
 <script src="http://kinonet.at.ua/pleer/video.js"></script>
 
 Плюс найдите код:
 
 <body>
 <video id="my-video" class="video-js" controls preload="auto" width="853" height="592"
 poster="test.jpg" data-setup="{}">
 
 удалите перед ним  <body>

Yuri_Geruk,
Спасибо большое)
Yuri_Geruk,
А нет, всё так же осталось, при изменение размера окна браузера так же вылазиет за пределы
Yuri_Geruk,
Не чего не изменилось. Попробовал в 3 разных браузерах и везде одно и тоже, при изменение размера окна браузера, плеер так и вылазиет за пределы.
Александр Боровиков,
Чтобы вам помочь вы должны сделать как я просил, вы этого не сделали и в итоге в шаблоне дублируются несколько блоков хеад и боди.
Yuri_Geruk,

вот сделал как вы написали

Александр Боровиков,
Я писал удалите ваш хеад с скриптами плеера и добавьте в текущий, что в верхне части в самом начале и боди дубль удалите.
Yuri_Geruk,
Вообще не понимаю, то что вы написали я сделал точ в точ
Александр Боровиков,

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

<link media="screen" href="/style/styles.css" type="text/css" rel="stylesheet" />
<link media="screen" href="/style/engine.css" type="text/css" rel="stylesheet" />
<link media="screen" href="/style/font-awesome.min.css" type="text/css" rel="stylesheet" />
<!--[if lte IE 7]>
<link rel="stylesheet" href="/style/lte-ie7.css" type="text/css" />
<a href="http://www.microsoft.com/rus/windows/internet-explorer/worldwide-sites.aspx" class="alert"></a>
<![endif]-->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->

а не так как вы делаете, вставляете отдельный хеад и боди дублируя в другом месте в шаблоне.

Александр Боровиков,

В стили пропишите следующее:

.video-js[tabindex="-1"] {width:100%!important;}

тогда не должно выходить за пределы. После как пропишите и сохраните изменения, кеш в браузере очистите https://ukit.com/ru/help/kak-ochistit-cahe

...