Fullpage.js - video &页面大小调整问题

我正在使用fullpage.js，我有一个问题与onloaddmeta函数，调整我的背景视频的大小。

当直接访问包含视频片段id的页面URL时，它可以完美地工作。也就是说，它会调整大小以占据整个屏幕。

如果我试图访问的部分id不是与背景视频的部分，我看到下面的错误-在这种情况下，视频调整正确，但剩下的页面是从顶部144px(这个错误修复自己，当我然后去滚动通过部分)。

错误:Uncaught (in promise) DOMException: play()请求被调用pause()中断。

当我使用包含背景视频的节id以外的任何节id刷新页面时，上述错误不会抛出，页面会正确调整大小-但视频不会。视频是默认大小。

我以前没有注意到这个问题，前面提到的一些问题似乎是零星的。今天我已经创建了页脚(不包含JS)，并调整了我的移动菜单，但没有什么不同，它是在JS方面。

我已经粘贴了下面的JS文件-正如你将看到的，我将Fullpage与Smoothstate结合使用。

如果有人有任何建议或反馈，我将永远感激。

提前感谢您的时间，

亲切的问候汤姆

编辑:如果我从部分中删除视频，一切都可以正常工作

( function( $ ) {
  function addFullPage() {
    if( $( 'html' ).hasClass( 'fp-enabled' ) ) {
      $.fn.fullpage.destroy( 'all' ); // uninitialise fullpage
    }
    $( '#fullpage' ).fullpage( {
      anchors: [ '2d', '3d', 'character','motionandgraphics', 'vfx', 'footer' ],
      scrollOverflow: false,
      fixedElements: '#masthead',
      afterLoad: function( anchorLink, index ) {
        if( index == 1 ) {
          console.log( 'afterload function' );
          $( '#video' ).get( 0 ).play();
        }
      }
    } );
    $( '#section0 video' ).on( 'loadedmetadata', function() {
      console.log( 'onloadedmetadata function' );
      var $width, $height, // Width and height of screen
       $vidwidth = this.videoWidth, // Width of video (actual width)
       $vidheight = this.videoHeight, // Height of video (actual height)
       $aspectRatio = $vidwidth / $vidheight; // The ratio the video's height and width are in
      ( adjSize = function() { // Create function called adjSize
        $width = $( window ).width(); // Width of the screen
        $height = $( window ).height(); // Height of the screen
        $boxRatio = $width / $height; // The ratio the screen is in
        $adjRatio = $aspectRatio / $boxRatio; // The ratio of the video divided by the screen size
        // Set the container to be the width and height of the screen
        $( '#section0' ).css( { 'width' : $width+'px', 'height' : $height+'px' } );
        if( $boxRatio < $aspectRatio ) { // If the screen ratio is less than the aspect ratio..
          // Set the width of the video to the screen size multiplied by $adjRatio
          $vid = $( '#section0 video' ).css( { 'width' : $width*$adjRatio+'px' } );
        } else {
          // Else just set the video to the width of the screen/container
          $vid = $( '#section0 video' ).css( { 'width' : $width+'px' } );
        }
      } )(); // Run function immediately
     // Run function also on window resize.
     $( window ).resize( adjSize );
    } );
    function iedetect( v ) {
      var r = RegExp( 'msie' + ( !isNaN(v) ? ( '''s' + v ) : '' ), 'i' );
      return r.test( navigator.userAgent );
    }
  }
  $( document ).ready( function(){
    addFullPage();
    console.log( 'document ready function' );
    mobMenu();
  } );
  function addBlacklistClass() {
    $( 'a' ).each( function() {
      if ( this.href.indexOf( '/wp-admin/' ) !== -1 || this.href.indexOf( '/wp-login.php' ) !== -1 ) {
        $( this ).addClass( 'wp-link' );
      }
    } );
  }
$( function() {
    addBlacklistClass();
    var settings = {
      anchors: 'a',
      blacklist: '.wp-link',
      onStart: {
        duration: 1000,
        render: function ( $container ) {
          $( '#content' ).addClass( 'fade-out' );
        }
      },
      onAfter: function( $container ) {
        addFullPage();
        console.log( 'on after function in smoothstate' );
        mobMenu();
        $( '#content' ).removeClass( 'fade-out' );
        var $hash = $( window.location.hash );
        if ( $hash.length !== 0 ) {
          var offsetTop = $hash.offset().top;
          $( 'body, html' ).animate( {
            scrollTop: ( offsetTop - 60 ),
          }, {
            duration: 280
          } );
        }
      }
    };
    $( '#page' ).smoothState( settings );
  } );
} )( jQuery );

 #fullpage .section video { position:absolute; top:0; left:0; width:100%; height:100%; display:none; }
@media ( min-aspect-ratio:16/9 ) {
  #fullpage .section video { width:100%; height:auto; }
}
@media ( max-aspect-ratio:16/9 ) {
  #fullpage .section video { width:auto; height:100%; }
}