Question

我有一个网站的部分在后台播放视频，它在主页上工作正常，但当我将代码复制到另一个页面时，它不会播放视频，只显示灰色背景。不太清楚发生了什么事？

这是HTML＆amp; jQuery的： -

<div id="whyus"></div><section class=" vc_custom_1405197800280  general-row"  >
        <div class="wpb_column col-md-12">

    <div id="videobgfull">
        <div class="videooverlay">

    <div class="container">
        <div class="general-title">
            <h2>5 reasons why you should choose UKCCTV Installations</h2>
            <hr>
            <p class="lead">&nbsp;</p>
        </div><!-- end general title -->

        <div class="custom-services">
           <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12 first">
    <div class="ch-item">   
        <div class="ch-info-wrap">
            <div class="ch-info">
                <div class="ch-info-front">
                    <i class="fa fa-comment fa-4x"></i>
                    <h3>Expert CCTV Advisors</h3>
                </div>
                <div class="ch-info-back">
                    <p>Industry professional staff to understand your scenario in detail and advise the most ideal solution that is suitable to your needs and fits the budget</p>
                </div>
            </div><!-- end ch-info -->
        </div><!-- end ch-info-wrap -->
    </div><!-- end ch-item -->
</div>
<div class="col-lg-3 col-md-3 col-sm-6 col-xs-12 ">
    <div class="ch-item">   
        <div class="ch-info-wrap">
            <div class="ch-info">
                <div class="ch-info-front">
                    <i class="fa fa-exclamation fa-4x"></i>
                    <h3>Attention to Detail</h3>
                </div>
                <div class="ch-info-back">
                    <p>Our business processes follow approach of leaving no stone unturned, from planning your system to getting it installed</p>
                </div>
            </div><!-- end ch-info -->
        </div><!-- end ch-info-wrap -->
    </div><!-- end ch-item -->
</div>
<div class="col-lg-3 col-md-3 col-sm-6 col-xs-12 ">
    <div class="ch-item">   
        <div class="ch-info-wrap">
            <div class="ch-info">
                <div class="ch-info-front">
                    <i class="fa fa-lightbulb-o fa-4x"></i>
                    <h3>Highly Qualified Engineers</h3>
                </div>
                <div class="ch-info-back">
                    <p>UK's most sought after team of highly qualified engineers with industry expertise enables us to set and maintain very high standards</p>
                </div>
            </div><!-- end ch-info -->
        </div><!-- end ch-info-wrap -->
    </div><!-- end ch-item -->
</div>
<div class="col-lg-3 col-md-3 col-sm-6 col-xs-12 ">
    <div class="ch-item">   
        <div class="ch-info-wrap">
            <div class="ch-info">
                <div class="ch-info-front">
                    <i class="fa fa-star-half-o fa-4x"></i>
                    <h3>No compromise on Quality</h3>
                </div>
                <div class="ch-info-back">
                    <p>A no compromise on quality approach ensures that our solutions are more robust, user-friendly and last for years and years running</p>
                </div>
            </div><!-- end ch-info -->
        </div><!-- end ch-info-wrap -->
    </div><!-- end ch-item -->
</div>
<div class="col-lg-3 col-md-3 col-sm-6 col-xs-12 last">
    <div class="ch-item">   
        <div class="ch-info-wrap">
            <div class="ch-info">
                <div class="ch-info-front">
                    <i class="fa fa-group fa-4x"></i>
                    <h3>Unrivalled Customer Care</h3>
                </div>
                <div class="ch-info-back">
                    <p>As completey 'customer centered' philosophy where needs and preferences of the customer are put first and everything else after</p>
                </div>
            </div><!-- end ch-info -->
        </div><!-- end ch-info-wrap -->
    </div><!-- end ch-item -->
</div>
        </div><!-- end row -->
    </div>
        </div>
    </div>

<script>
     jQuery(document).ready(function(cash) {
         var $ = jQuery;
      var Video_back = new video_background($("#videobgfull"), { 
       "position": "absolute", //Stick within the div
       "z-index": "-1",  //Behind everything
       "loop": true,    //Loop when it reaches the end
       "autoplay": true,  //Autoplay at start
       "muted": true,   //Muted at start
       "youtube": "hT6eSm-UhiM", //Youtube video id
       "start": 5,     //Start with 6 seconds offset (to pass the introduction in this case for example)
       "video_ratio": 1.7778,   // width/height -> If none provided sizing of the video is set to adjust
       "fallback_image": "videos/main.jpg", //Fallback image path
      });
     });
</script>

你可以看到它在这里工作：

http://176.67.174.179/ukcctvinstallations.co.uk/

并且不在这里工作：

http://176.67.174.179/ukcctvinstallations.co.uk/product/1-camera-residential-system-hi-res/

Answer 1

...new video_background(...不在第二个网址的HTML源代码中，我几乎可以肯定这是问题：）

视频播放无法在网站页面上播放

1 个答案: