Отключение встроенного видео vimeo

На веб-сайте, который я создаю, у меня встроено видео vimeo. Клиент должен держать звук на видео, очевидно, для людей, которые находят его на vimeo. Однако для ее сайта звук просто раздражает. Поэтому мне нужно найти способ отключить звук в коде для встраивания. Я искал его, но не мог найти ничего четкого. Как вы можете видеть из моего кода ниже, я использовал команду автозапуска в ссылке, которую я надеялся, что смогу сделать подобное, чтобы отключить звук.

    <iframe src="http://player.vimeo.com/video/4415083?  title=0&amp;byline=0&amp;portrait=0&amp;color=d01e2f&amp;autoplay=1" width="500" height="281"  frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>

Спасибо

Ответы

Ответ 1

В случае, если это кому-то помогает, Vimeo добавил параметр "background" для встраивания видео, который автоматически воспроизводит видео. В некоторых случаях это будет полезно, когда люди хотят отключить видео - вот их пример:

<iframe src="https://player.vimeo.com/video/76979871?background=1" 
    width="500" height="281" frameborder="0" webkitallowfullscreen 
    mozallowfullscreen allowfullscreen></iframe>

Ответ 2

вы будете использовать setVolume API в вашем Vimeo.. player.api('setVolume', 0); это будет так...

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        <script src="//f.vimeocdn.com/js/froogaloop2.min.js"></script>
        <iframe id="vimeo_player" src="http://player.vimeo.com/video/4415083?title=0&amp;byline=0&amp;portrait=0&amp;color=d01e2f&amp;autoplay=1&player_id=vimeo_player" width="500" height="281"  frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
        <script>
        var iframe = $('#vimeo_player')[0],
            player = $f(iframe),
            status = $('.status');

            player.addEvent('ready', function() {
                player.api('setVolume', 0);
            });
        </script>

Ответ 3

Я попробовал примеры в ответах без везения. Изучив документацию, я заметил, что отсутствует параметр &player_id=IFRAME_ID. Возможно, что-то изменилось в API Vimeo, так как для меня работает следующий пример:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://f.vimeocdn.com/js/froogaloop2.min.js"></script>
<iframe id="vimeo_player" src="//player.vimeo.com/video/4415083?api=1&player_id=vimeo_player&autoplay=1&loop=1&color=ffffff" width="1920" height="1080" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

<script>
$(function() {
    var vimeo_iframe = $('#vimeo_player')[0];
    var player = $f(vimeo_iframe);

    player.addEvent('ready', function() {
        player.api('setVolume', 0);
    });
});
</script>

Ответ 4

Кажется, что Vimeo предоставляет обновленную библиотеку, а синтаксис API немного отличается от старого (Froogaloop). Здесь как отключить встроенное видео с помощью JS:

<!--Add the id attr to the iframe tag to use as a selector-->
<iframe id="embeddedVideo" src="http://player.vimeo.com/video/4415083? title=0&amp;byline=0&amp;portrait=0&amp;color=d01e2f&amp;autoplay=1" width="500" height="281"  frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>

<!--Include the Vimeo API Library-->
<script src="https://player.vimeo.com/api/player.js"></script>

<!--Select and manipulate your video-->
<script type="text/javascript">
    //Select the #embeddedVideo element
    var video = document.getElementById('embeddedVideo');

    //Create a new Vimeo.Player object
    var player = new Vimeo.Player(video);

    //When the player is ready, set the volume to 0
    player.ready().then(function() {
        player.setVolume(0);
    });
</script>

Надеюсь, это поможет всем, кто использует новую библиотеку. Документация находится на vimeo/player.js

Ответ 5

Так как большинство ответов здесь относятся к Vimeo old api. Вот самый простой способ с новым api. Вы можете включить vimeo player.js из своего CDN, или вы можете скачать его, или вы можете включить его из npm.

<script src="https://player.vimeo.com/api/player.js"></script>

или

npm install @vimeo/player

то вы можете сделать следующее.

    <script>
    var iframe = document.querySelector('iframe');
    var player = new Vimeo.Player(iframe);

    player.setVolume(0);
  </script>

что он. И если вы используете angular 2+,

import * as Vimeo from '@vimeo/player';

const iframe = e.target;
const player = new Vimeo(iframe);
player.setVolume(0);

здесь e.target - это $event, который будет передан из шаблона. Вероятно, это может быть событие iframe (load). Или, может быть, вы можете использовать jquery для выбора iframe.

Ответ 6

Для не платящих участников

Вам просто нужно добавить параметр muted. Например.:

<iframe src="https://vimeo.com/48400332?autoplay=1&loop=1&muted=1" ></iframe>

Для платных членов

Согласно Vimeo, параметр background поддерживается только для видео, размещенных платными участниками.

Источник: https://help.vimeo.com/hc/en-us/articles/115004485728-Autoplaying-and-looping-embedded-videos

Ответ 7

@Ответ Gadss отлично работает, но я обнаружил, что вам нужно обновить iframe src, чтобы включить активацию Vimeo api. Просто укажите api = 1 после идентификатора vimeo.

Я также обнаружил, что по некоторым причинам это иногда не работает на Safari.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="//f.vimeocdn.com/js/froogaloop2.min.js"></script>
    <iframe id="vimeo_player" src="http://player.vimeo.com/video/4415083?api=1&title=0&amp;byline=0&amp;portrait=0&amp;color=d01e2f&amp;autoplay=1" width="500" height="281"  frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
    <script>
    var iframe = $('#vimeo_player')[0],
        player = $f(iframe),
        status = $('.status');

        player.addEvent('ready', function() {
            player.api('setVolume', 0);
        });
    </script>

Ответ 8

** Вот мое решение:   http://jsfiddle.net/jakeoblivion/phytdt9L/5/

(Вам понадобятся ваши собственные иконки воспроизведения/паузы без звука)

  //load video muted
  var video = $("#myvideo");
  video.vimeo("play");
  video.vimeo("setVolume", 0);

    //toggle play/pause
  $('#play-pause').click(function() {
    $(this).toggleClass('play');
    if ($(this).hasClass('play')) {
      //pause video
      video.vimeo("pause");
      $(this).css('background', 'pink');
    } else {
      //unpause video
      video.vimeo("play");
      $(this).css('background', 'blue');
    }
  });

  //toggle mute/unmute
  $('#mute-unmute').click(function() {
    $(this).toggleClass('mute');
    if ($(this).hasClass('mute')) {
      //unmute video
  video.vimeo("setVolume", 1);
      $(this).css('background', 'green');

    } else {
      //mute video
  video.vimeo("setVolume", 0);
      $(this).css('background', 'red');
    }
  });

Проведенный возраст пытался, и ничто, казалось, не сработало.

Мне просто захотелось отключить автовоспроизведение Vimeo (том 0) с помощью простых элементов управления Play/Pause Mute/Unmute вместо их стандартных по умолчанию. (не стесняйтесь использовать значки вместо временных цветов, которые я положил).

(если вы хотите добавить элементы управления по умолчанию назад, но приглушите, удалите "? background = 1". По умолчанию background = 1 установит video.vimeo( "setVolume", 0) и скроет элементы управления, поэтому я также добавил приглушение при загрузке без установки фона = 1).

Также обратите внимание: "Вам нужно будет работать на веб-сервере, а не открывать файл непосредственно в вашем браузере. Ограничения безопасности JS будут препятствовать работе API при локальном запуске".

Ответ 9

Это единственный способ для меня: http://jsfiddle.net/87dsjL8q/108/

var iframe = document.getElementsByTagName('iframe')[0];
var player = $f( iframe );

 player.addEvent('ready', function() {
     player.api('setVolume', 20); 
 });

Ответ 10

<iframe src="http://player.vimeo.com/video/4415083?muted=1;  title=0;byline=0;portrait=0;color=d01e2f;autoplay=1" width="500" height="281"  frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>

вы можете просто дать "muted = 1", чтобы видео было отключено... Chrome позволяет автоматически воспроизводить видео, которые отключены

Ответ 11

Я нашел способ сделать это. Вы запускаете приглушенное видео, чтобы оно воспроизводилось автоматически, а затем при первом обновлении времени устанавливаете громкость на 1.

var options = {
    id: 'video_id_here',
    width: 640,
    loop: false,
    muted: true,
    autoplay: true
};

var player = new Vimeo.Player('vimeo', options);

player.setVolume(0);

player.on('timeupdate', set_autoplay_volume );

function set_autoplay_volume(){
    player.setVolume(1);
    player.off('timeupdate', set_autoplay_volume );
}

Ответ 12

Вы пытаетесь вставить ?muted=1 после ссылки в attribute src

Например,

<iframe id="vimeo_player" src="https://player.vimeo.com/video/257992348?muted=1">