时间戳

首页 > 解决方案 > youtube 视频背景

javascript - youtube 视频背景

问题描述

如您在本页 http://khayalshop.net/video.a5w中看到的，我正在 html 背景上播放视频 YouTube

一切正常，希望在背景播放视频时声音不起作用 缺少什么？视频播放时是否可以播放声音？

这是页面上写的代码

 <!DOCTYPE html>
 <html>
 <head>
  <meta name="generator" content="Alpha Anywhere HTML Editor Version 12 
 Build 2089-4283">
 <!-- must use in order to make XP Themes render -->
 <meta HTTP-EQUIV="MSThemeCompatible" content="Yes" />
 <meta http-equiv="X-UA-Compatible" content="IE=edge" />
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
 <meta name="viewport" content="width=device-width, initial-scale=1.0, 
 maximum-scale=1.0, user-scalable=no" />
 <meta name="apple-mobile-web-app-capable" content="yes" />
 <style>
 <!--
 #player {width: 100%; height: 100%; position: fixed; z-index: -99;}
 #myid {background: rgba(0,0,0,.1); width: 100%; height: 100%; position: 
 fixed; z-index: 1;}
 iframe .html5-video-player .html5-watermark {display: none !important;}
 -->
 </style>
 <script>
 <!--
 var player;

 function onYouTubePlayerAPIReady() {
 player = new YT.Player('player', {
    playerVars: {
        'autoplay': 1,
        'controls': 0,
        'autohide': 1,
        'wmode': 'opaque',
        'showinfo': 0,
        'loop': 1,
        'mute': 1,
        'modestbranding': 1,
        //'start': 15,
        //'end': 110,
        'playlist': 'zbB_ghXp5L0'
    },
    videoId: 'zbB_ghXp5L0',
    events: {
        'onReady': onPlayerReady
    }
   });

   }

  function onPlayerReady(event) {
  event.target.mute();
  $('#text').fadeIn(400);
  //why this? Well, if you want to overlay text on top of your video, 
  you
   //will have to fade it in once your video has loaded in order for 
    this
   //to work in Safari, or your will get an origin error.
  }

  //this pauses the video when it's out of view, just wrap your video in 
  .m-//video
  $(window).scroll(function() {
  var hT = $('.m-video').height(),
   wS = $(this).scrollTop();
   if (wS > hT) {
   player.pauseVideo();
    }
   else {
   player.playVideo();
   }
   });
   -->
   </script>
   <title></title>
   </head>
   <body>
   <script src="https://www.youtube.com/player_api"></script>
   <div id="myid"></div>
   <div id="player"></div>



   </body>

   </html>

标签： javascripthtmlyoutubevideo-streaming

解决方案

尝试：

'mute': 1

或者：

搜索视频播放后如何以编程方式增加音量（即player.playVideo();）。

推荐阅读