अंतिम फ्रेम पर एम्बेडेड यूट्यूब वीडियो को कैसे रोकें?

Question

एम्बेडेड यूट्यूब वीडियो चलाते समय, मैं पूरा होने पर खराब रिज़ॉल्यूशन थंबनेल प्रदर्शित नहीं करना चाहता हूं। इसके बजाय मैं अंतिम फ्रेम की एक उच्च-रिज़ॉल्यूशन छवि चाहता हूं। क्या यह संभव है?

या तो मैं अंतिम फ्रेम पर रोक सकता हूं या शायद अंतिम फ्रेम का उच्च-रिज़ॉल्यूशन थंबनेल बनाने का कोई तरीका है?

Answer 1

प्लेबैक समाप्त होने पर पता लगाने के लिए आप यूट्यूब प्लेयर एपीआई का उपयोग कर सकते हैं, और उस बिंदु पर प्लेयर को स्वैप करने के लिए कुछ डीओएम हेरफेर करते हैं और img टैग में वीडियो के थंबनेल में से किसी एक को इंगित करते हैं। वीडियो में अंतिम फ्रेम के लिए आम तौर पर एक थंबनेल नहीं होगा, हालांकि, आपको एक अलग थंबनेल चुनना होगा।

यदि आप वीडियो समाप्त होने पर दिखाए गए संबंधित वीडियो को अक्षम करना चाहते हैं, तो आप rel=0 प्लेयर पैरामीटर का उपयोग कर सकते हैं, लेकिन यह आपको एक ब्लैक स्क्रीन के साथ छोड़ देगा।

Answer 2

वीडियो प्लेयर एक कॉलबैक "onStateChange" स्थिति साथ स्थिति के साथ कॉलबैक YT.PlayerState.ENDED कॉल करने से पहले YT.PlayerState.PAUSED देता है, तो आप यहां देख सकते हैं।

मैं भी वही कर रहा हूं। मैं सिर्फ वीडियो को रीप्ले बटन के साथ कवर करने के लिए ओवरले दिखा रहा हूं, लेकिन फिर भी यह वीडियो के अंत में दिखाई देता है और फिर ओवरले दिखाई देता है (कुछ गड़बड़ दिखाई देती है)

Answer 3

मैं इस समस्या में भाग गया और एक गुच्छा खर्च करने के बाद समय के साथ खेल रहा है, मेरे लिए सबसे अच्छा समाधान वीडियो को अंत से पहले दूसरे का एक अंश रोकना था, इस प्रकार इसे उस फ्रेम पर रखना था। कुछ इस तरह:

var player; 

     function onYouTubePlayerAPIReady() { 
     player = new YT.Player('player', { 
      playerVars: { 'autoplay': 1, 'controls': 0,'loop': 1, 'showinfo': 0, 'disablekb': 1, 'version': 3, 'vq': 'large', 'wmode':'opaque','rel': 0 }, 
      videoId: 'YOURVIDEOID', 
      events: { 
      'onReady': onPlayerReady, 
      'onStateChange': onStateChange, 
      'onytplayerStateChange': onStateChange } 

     }); 

     } 

    var done = false; 
    function onStateChange(event){ 
     var videoDuration = player.getDuration(); 
     if (event.data == YT.PlayerState.PLAYING && !done) { 
      // pause 0.1 seconds before the end 
      setTimeout(pauseVideo, (videoDuration-0.1)*1000); 
      done = true; 
     } 
    } 

    function pauseVideo() { 
     player.pauseVideo(); 
    } 

वीडियो शुरू होता है (जिसे हम onStateChange का उपयोग कर पकड़) के बाद, हम YouTube प्लेयर एपीआई से वीडियो अवधि प्राप्त कर सकते हैं (player.getDuration का प्रयोग करके), और फिर एक समारोह समय पर setInterval का उपयोग करने वाले अंत से पहले वीडियो 0.1 सेकंड (या जो भी मूल्य हम चुनते हैं) को रोकता है।

Answer 4

इस मुद्दे पर में चलाने के बाद भी मैं इस के साथ समाप्त हो गया है, जो है अब तक मेरे लिए बहुत लगातार काम कर रहा है:

var player; 
var curTimer; 
function onYouTubeIframeAPIReady() { 
    player = new YT.Player('player', { 
        videoId: 'The Video ID', 
        playerVars: { 'rel':0, 'enablejsapi':1, 'autohide':1, 'wmode':'opaque'} 
       }); 
    player.addEventListener('onReady', 'onPlayerReady'); 
    player.addEventListener('onStateChange', 'onPlayerStateChange'); 
} 
function onPlayerStateChange(event) { 
    var videoDuration = event.target.getDuration(); 
    var curTime = event.target.getCurrentTime(); 
    if (curTime) { 
     /** Video Already Started */ 

     /** Get video time remaining. */ 
     videoDuration = videoDuration-curTime; 

     /** Remove old 'setTimeout' function */ 
     removeTimeout(curTimer); 
    } 
    /** 
     Note: The '.25' is time subtracted to stop video on last frame. 
     Adjust this as needed. 
    */ 
    /** Add/Re-Add 'setTimeout' function with video time remaining. */ 
    curTimer = setTimeout(pauseVideo, (videoDuration-.25)*1000); 
} 
function removeTimeout(elTimer){ 
    /** Remove old timer */ 
    clearTimeout(elTimer); 
} 
function stopVideo() { 
    player.stopVideo(); 
} 

स्पष्टीकरण और/या नोट टिप्पणियों के भीतर कर रहे हैं।