視頻橫幅結束圖片

Question

使用以下代碼在Squarespace的橫幅廣告中播放視頻。希望這樣，當視頻結束橫幅加載橫幅圖像。似乎無法得到它的工作。任何幫助將不勝感激。順便說一句，完全陌生的腳本。

謝謝！

<script type="text/javascript"> 
     $(window).bind("load", function() { 
     if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) { 
     } else { 
      var banner = $('#pageWrapper img').first(); 
      if (banner.length === 0) 
      banner = $('.banner-thumbnail-wrapper > #thumbnail > img').first(); 
      if (banner.length === 0) 
      banner = $('#parallax-images img').first(); 
      if (banner.length === 0) 
      banner = $('.has-main-image img').first(); 
      if (banner.length === 0) 
       banner = $('#page-thumb img').first(); 
      var url = "VIDEOHERE"; 
      banner.hide(); 
      $('<video class="bannerVideo" autoplay="" preload><source src="' + url + '" type="video/mp4"></video>').insertAfter(banner); 
      adjustBanner($('.bannerVideo'), banner); 
      setTimeout(function() { 
      adjustBanner($('.bannerVideo'), banner); 
      }, 2000); 
      $(window, banner).resize(function() { 
      adjustBanner($('.bannerVideo'), banner); 
      setTimeout(function() { 
       adjustBanner($('.bannerVideo'), banner); 
      }, 200); 
      }); 
     } 
     function adjustBanner (video, banner) { 
      video.css({ 
      height: banner.css('height'), 
      width: banner.css('width'), 
      top: banner.css('top'), 
      left: banner.css('left'), 
      position: 'relative', 
      'object-fit': 'inherit' 
      }); 
     } 
     }); 


    </script> 

Answer 1

在插入視頻後，您可以附加一個onended事件偵聽器。

var video = querySelector('.bannerVideo'); 
video.onended = function() { 
    // Display Image 
    adjustBanner($('.bannerVideo'), banner); 
}