Как можно увеличить или уменьшить размер видео?

Как можно добавить кнопку масштабирования видео к web-плееру с помощью расширения для браузера или скрипта Tampermonkey для того, чтобы корректно отображать видео с соотношением сторон 16:9 на мониторе с соотношением сторон 21:9?
Изображение к вопросу
  • 5 января 2024 г. 17:08
Ответы на вопрос 2
Если вы хотите увеличить или уменьшить размер видео (разрешение), то можете воспользоваться различными видеоредакторами или конвертерами, такими как Adobe Premiere, Final Cut Pro, Handbrake, и многими другими.

Для добавления кнопки масштабирования видео на веб-страницу с помощью пользовательского скрипта для Tampermonkey, вам нужно будет написать небольшой фрагмент JavaScript, который будет манипулировать стилями DOM-элемента видео. Перед использованием скриптов убедитесь, что это не нарушает условия использования сайта и его политику конфиденциальности.

Вот пример скрипта, который мог бы добавить такую кнопку:

```javascript
// ==UserScript==
// @name         Видео Масштабирование для 21:9
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Добавить кнопку масштабирования для видео 16:9 на мониторы 21:9
// @author       Вы
// @match        *://*/*
// @grant        none
// @run-at       document-end
// ==/UserScript==

(function() {
    'use strict';

    // Функция для масштабирования видео
    function scaleVideo(video, scale) {
        video.style.width = scale ? '100vw' : 'auto'; // "100vw" означает 100% от ширины видимой области
        video.style.height = scale ? 'calc(100vw * 9 / 21)' : 'auto'; // Вычисляем высоту для 21:9
    }

    // Добавляем стиль для нашей кнопки
    const style = document.createElement('style');
    style.type = 'text/css';
    style.innerHTML = `.scale-toggle { position: fixed; z-index: 10000; top: 10px; right: 10px; padding: 5px; background: #FFF; border: 1px solid #000; cursor: pointer; }`;
    document.head.appendChild(style);

    // Создаем кнопку
    const button = document.createElement('button');
    button.innerText = 'Масштабировать видео';
    button.classList.add('scale-toggle');

    // Переменная для состояния масштабирования
    let isScaled = false;

    // Функционал кнопки
    button.addEventListener('click', function() {
        const video = document.querySelector('video'); // Выбираем видео на странице
        if (video) {
            isScaled = !isScaled;
            scaleVideo(video, isScaled);
        }
    });

    // Добавляем кнопку на страницу
    document.body.appendChild(button);

})();
```

Этот скрипт добавит кнопку на страницу, которая при нажатии будет изменять размер отображаемого видео. Адаптируйте селектор `document.querySelector('video')` под ваше видео или укажите конкретный класс/ID.

Обратите внимание, что этот скрипт является лишь примером и возможно потребует дополнительной адаптации под конкретный сайт или плеер, который вы используете.

Если вы не знакомы с написанием таких скриптов, рекомендую быть осторожным и предварительно ознакомиться с основами JavaScript и CSS. В неправильных руках такие скрипты могут нарушить функционал сайта или даже создать уязвимости для безопасности.
дополнение в браузер 
ultrawidify
Похожие вопросы