Задать вопрос

Danny Arty

Гриффиндор в моде при любой погоде!

488

вклад
27

вопросов
712

ответов
48%

решений

Комментарии

Как сделать фулскрин для ютуб-роликов?

Danny Arty @DanArst Куратор тега JavaScript

js-css-html-php, вот так сделайте

<body>

<div id="player_block"></div>
<button id="fullscreen-btn">Fullscreen</button>

<script> "use strict"




let scrpt = document.createElement('script')
scrpt.src = 'https://www.youtube.com/iframe_api'
document.body.appendChild(scrpt)

let player = null

window.onYouTubeIframeAPIReady = function()
{
  let ups = {
  width : 500,
  height : 300,
  videoId : 'vZK1V5aekF0',
  controls : 1,
  events : {
    onReady : player_ready,
    onStateChange : player_changed,
    },
  }
player = new YT.Player('player_block', ups)
}

let player_ready = function(event)
{
let player_window = document.querySelector('#' + 'player_block')
player_window.allowfullscreen = 'allowfullscreen'
event.target.playVideo()
}

let player_changed = function()
{
}

var button = document.getElementById('#fullscreen-btn');
button.addEventListener('click', fullscreen);
// when you are in fullscreen, ESC and F11 may not be trigger by keydown listener. 
// so don't use it to detect exit fullscreen
document.addEventListener('keydown', function (e) {
  console.log('key press' + e.keyCode);
});
// detect enter or exit fullscreen mode
document.addEventListener('webkitfullscreenchange', fullscreenChange);
document.addEventListener('mozfullscreenchange', fullscreenChange);
document.addEventListener('fullscreenchange', fullscreenChange);
document.addEventListener('MSFullscreenChange', fullscreenChange);

function fullscreen() {
  // check if fullscreen mode is available
  if (document.fullscreenEnabled || 
    document.webkitFullscreenEnabled || 
    document.mozFullScreenEnabled ||
    document.msFullscreenEnabled) {
    
    // which element will be fullscreen
    var iframe = document.querySelector('#player_block iframe');
    // Do fullscreen
    if (iframe.requestFullscreen) {
      iframe.requestFullscreen();
    } else if (iframe.webkitRequestFullscreen) {
      iframe.webkitRequestFullscreen();
    } else if (iframe.mozRequestFullScreen) {
      iframe.mozRequestFullScreen();
    } else if (iframe.msRequestFullscreen) {
      iframe.msRequestFullscreen();
    }
  }
  else {
    document.querySelector('.error').innerHTML = 'Your browser is not supported';
  }
}

function fullscreenChange() {
  if (document.fullscreenEnabled ||
       document.webkitIsFullScreen || 
       document.mozFullScreen ||
       document.msFullscreenElement) {
    console.log('enter fullscreen');
  }
  else {
    console.log('exit fullscreen');
  }
  // force to reload iframe once to prevent the iframe source didn't care about trying to resize the window
  // comment this line and you will see
  var iframe = document.querySelector('iframe');
  iframe.src = iframe.src;
}
</script>
</body>

Написано более трёх лет назад

Как сделать фулскрин для ютуб-роликов?

Danny Arty @DanArst Куратор тега JavaScript

js-css-html-php, вот еще пример с codepen

Написано более трёх лет назад

Как сделать фулскрин для ютуб-роликов?

Danny Arty @DanArst Куратор тега JavaScript

js-css-html-php, попробуйте добавить свою кнопку для фулскрина:

var isFullScreenMode = false;

$(".full-screen").on("click", function() {
    if (isFullScreenMode) {
        $(".video-player").height(здесь высота которую вы задаете);
        isFullScreenMode = false;
    } else {
        $(".video-player").height($(window).height());
        isFullScreenMode = true;
    }
})

Написано более трёх лет назад

Как сделать фулскрин для ютуб-роликов?

Danny Arty @DanArst Куратор тега JavaScript

js-css-html-php, а что написано в ошибке?

Написано более трёх лет назад
Как отследить клик по кнопке ютуб?

Danny Arty @DanArst Куратор тега HTML

Дмитрий Тарасов, че то я туплю уже, это же iframe. Там никак не отследить вроде.
Если что, почитайте эту ветку - мб какое-нибудь решение подойдет

Написано более трёх лет назад
Как отследить клик по кнопке ютуб?
Danny Arty @DanArst Куратор тега HTML
Дмитрий Тарасов, ну дык так)

var ytButton= document.getElementsByClassName("yt-uix-button"); ytButton.onclick = (function() { --тут производите какие-то действия на той же странице-- })();

Написано более трёх лет назад
Как отследить клик по кнопке ютуб?

Danny Arty @DanArst Куратор тега HTML

Дмитрий Тарасов,
Как отследить клик по кнопке ютуб?

что вы под этим вопросом имеете в виду?

Я лично понимаю слово "отследить клик" - это отправить событие при клике на кнопку в сервисы аналитики (google analytics или yandex metrika).
Код, который я скинул, как раз для того, чтобы при клике на кнопку отправилось событие в Google Analytics, где _gaq - команда отправки данных (классическая аналитика)

Написано более трёх лет назад
Откуда берётся этот класс?

Danny Arty @DanArst Куратор тега CSS

Alinw,
php artisan cache:clear

Написано более трёх лет назад
Какую мобильную рекламную СРА выбрать для интеграции в андроид приложение?

Danny Arty @DanArst

Chesterfield25, ну он видимо сам написал парсер, потому что лично знаю только два сервиса, которые платят только в сатоши и при этом стабильны - adbtc.top и bitter.io и при этом они не предоставляют в открытую свое API, возможно предоставят по запросу. В принципе ни разу не видел букс, предоставляющий открытую документацию по API для интеграции с приложением.

Написано более трёх лет назад
Какую мобильную рекламную СРА выбрать для интеграции в андроид приложение?

Danny Arty @DanArst

Chesterfield25, ну не суть. В плане это же типичное приложение-букс по заработку сатошей - таких сотни тысяч сейчас. Вам надо либо свое букс-приложение запилить, чтобы принимать туда задания, либо попробовать парсить с других.

Написано более трёх лет назад
Какую мобильную рекламную СРА выбрать для интеграции в андроид приложение?

Danny Arty @DanArst

больше похоже на скрин букса

Написано более трёх лет назад
Откуда берётся этот класс?

Danny Arty @DanArst Куратор тега CSS

Alinw, у вас сайт на laravel? Почистите его кэш

Написано более трёх лет назад
Откуда берётся этот класс?

Danny Arty @DanArst Куратор тега CSS

Alinw, почистите кэш браузера нажав ctrl+f5. Отобразится сразу

Написано более трёх лет назад
Откуда берётся этот класс?

Danny Arty @DanArst Куратор тега CSS

Alinw, да кстати странно, что % перенесся на другую строку как отдельный параметр, и у изображения не отображается заданный вами стиль.
В консоли что за ошибки?

Написано более трёх лет назад
Откуда берётся этот класс?

Danny Arty @DanArst Куратор тега CSS

Alinw, ну дык max-width не есть width...

Написано более трёх лет назад
Почему при использовании input range + transform scale дёргается изображение?

Danny Arty @DanArst Куратор тега CSS

у картинки установлено w и h на 100% в css и оно растягивается на всю ширину своего родителя

А каким образом оно может быть больше размеров родителя?

Написано более трёх лет назад
Google Ads ограничивает показ объявлений из-за нарушения юридических требований. Как быть?

Danny Arty @DanArst

Olenyasha17, на картинке и в тексте тогда должно быть указано 18+. После этого обычно пропускают

Написано более трёх лет назад
Как решить задачу SMM?

Danny Arty @DanArst

Пума Тайланд, мда...старость не радость видимо

Написано более трёх лет назад
Очень странно срабвтывают @media запросы, что делать?

Danny Arty @DanArst Куратор тега CSS

Явно перебиваются стили

Написано более трёх лет назад
Почему в браузере блокируются куки сайта?

Danny Arty @DanArst

может это third-party куки?

Написано более трёх лет назад

Самые активные сегодня

Aragorn
- 8 ответов
- 0 вопросов
Александр
- 3 ответа
- 0 вопросов
Everything_is_bad
- 3 ответа
- 0 вопросов
rPman
- 3 ответа
- 0 вопросов
Сергей Сахаров
- 3 ответа
- 0 вопросов
Dark Hacker
- 2 ответа
- 1 вопрос

Войдите на сайт