Добрый день!
Помогите пожалуйста решить ряд задач.
Необходимо поставить на страничку 2 и более небольших плеера
Я решил воспользоваться библиотекой Video.js
Скачав её к себе на компьютер.
Всё хорошо, всё работает. Но есть ряд задач.
Это расположить кнопку старта по центру.
проблема в том что у кнопки нет уникального ID на странице а костыль с сылкой через название class работает только в том случае если проигрыватель один и его подмножество имён уникально.
Как вы наверное уже догадались форматы видосиков по шерене и высоте разные именно поэтому размещение кнопки по центру вызывает проблему.
Я полез в библиотеку в надежде что разберусь сам но там все элементы управления собираются через “.prototype”
Я им никогда не пользовался, поэтому требуется помощь.
Да и сам код далёк от моего понимания
Я так сложно не пишу. Конечно огромный поклон разработчикам video.js они реально молодци, так как работает всё идеально ни каких проблем с установкой всё предельно понятно без инструкции.
Но хотелось бы наличие комментов по коду, так как откуда, что вытекает остаётся только догадываться из названий классов и функций.
Последовательная загрузка проигрыветелей в первый раз приводит к тому, что второй проигрыватель, по непонятным мне причинам загружается без обработки высоты и ширины. Однако при перезагрузки страницы всё становиться нормальным.
Если стираем историю загрузки из обозревателя, то проблема повторяется.
Простая костомизация.
Мне хотелось бы чтобы задний фон был “transparent”
При нажатии на область просмотра она не получала свойства “border-color” и не подсвечивала всю область клика белой рамкой.
Вопрос уже к людям которые работали с Video.js
Как настроить плеер чтобы при завершении видео обратно размещался постер и большая кнопка?
Разумеется видео не на повторе.
Я понимаю что это довольно не тривиальные задачи поэтому готов заплатить если понадобиться.
Очень надеюсь на Ваше понимание.
Спасибо.
The player skin is completely built from HTML and CSS, including when Flash and other players like YouTube are used.
Skin changes can be as simple as centering the play button (you can just add the ‘vjs-big-play-centered’ class to your video tag), or as complex as creating entirely new layouts. We’ve built a codepen project where you can explore different changes.
А что за обработка?
Что в коде?
В DevTools есть ошибки в консоли?
Внутри кода я искал где присваивается class=vjs-big-play-button
Нашёл:
n.prototype.buildCSSClass = function () {
return "vjs-big-play-button";
}
Мне бы понять как происходит вызов методов для того чтобы добавить атрибут ID
В идеале было бы не плохо ещё разобраться откуда берётся значение id на video элементе
Так как изначально там стоит “my-player2” после загрузки получается “my-player2_html5_api”
Было бы совсем хорошо если бы на большой кнопке было id=“my-player2_BigButton”
Тысяча чертей.
Вы совершенно правы.
Костыль в FireFox
При этом он как любом элементе на который кликабилен, после нажатия остаётся какая-то рамка чёрно белая.
Что делать?
Подскажите.
Если отключить #form-controls-refresh
то всё равно рисует какую-то синюю хрень вокруг кликнутого элемента, но по крайне мере не так заметно.
Это можно поменять как-нибудь с помощью javascript? #form-controls-refresh disabled
Не знаю хорошее ли это решение, может по ссылке выше или тут что-то лучше предложено. Но там вроде бы в основном про фокус при переключении клавиатурой между элементами речь, если это не важно, то наверно сойдет.