2014-04-04 9 views
5

मैं खेल के बाद वीडियो पोस्टर दिखाना चाहता हूं। मैं कोड का पालन करने की कोशिश कर रहा हूं लेकिन कोई भाग्य नहीं।वीडियो प्ले के एचटीएमएल 5 वीडियो पोस्टर अंत कैसे दिखाएं?

var video=$('#cms_video').get(0); 
video.play(); 
video.addEventListener('ended',function(){ 
    this.posterImage.show(); 
}); 
+0

संभावित डुप्लिकेट http://stackoverflow.com/questions/14245644/ एचटीएमएल 5-वीडियो-एंड-ऑफ-ए-वीडियो-पोस्टर) –

उत्तर

-1

कोशिश अपने पोस्टर देने के लिए एक id या वर्ग तो आप कर सकते हैं:

var video=$('#cms_video').get(0); 
video.play(); 
video.addEventListener('ended',function(){ 
    $('#poster').show(); 
    //^Use . here if you apply class instead of if for your poster 
}); 
+2

मैं किसी भी वर्ग को लागू नहीं करना चाहता हूं। मैं वीडियो पोस्टर दिखाना चाहता हूं। वीडियो पोस्टर का मतलब है कि एचटीएमएल वीडियो प्लेयर में पोस्टर का गुण है, यह वीडियो प्लेयर लोड करने और वीडियो प्ले से पहले दिखाता है। अब मैं वीडियो प्ले के इस पोस्टर एंड को दिखाना चाहता हूं। – LoganPHP

+0

क्या आप अपना एचटीएमएल मार्कअप दिखा सकते हैं? – Felix

+0

<वीडियो चौड़ाई = "1024" ऊंचाई = "576" पोस्टर = "http://example.com/a.png" नियंत्रण = "नियंत्रण" preload = "auto" id = "cms_video"> <स्रोत प्रकार = " वीडियो/एमपी 4 "src =" http://example.com/a.mp4 "> कोई फ़्लैश प्लेयर स्थापित नहीं किया गया है। Please select a player to play Flash videos. LoganPHP

4

अंत में मैं कोड

var video=$('#cms_video').get(0);   
video.play(); 
video.addEventListener('ended',function(){ 
    v=video.currentSrc; 
    video.src=''; 
    video.src=v;    
}); 
आप वीडियो के अंत में
+0

मेरा उत्तर देखने का प्रयास करें मुझे लगता है कि यह थोड़ा आसान है –

0

निम्नलिखित के साथ अपने लक्ष्य को हासिल किया, पोस्टर के समान स्रोत के साथ एक div दिखाएं (ऊपरी जेड-इंडेक्स के साथ या वीडियो छुपाएं) यदि आपको वीडियो को फिर से चलाने की आवश्यकता है, तो दिखाए गए div पर एक क्लिक ईवेंट बांधें (दृश्यता को स्विच करने के लिए nd पुनरावृत्ति)

8

ऐसा करने का एक और अधिक सरल तरीका:

<script type="text/javascript"> 
var video= $('#cms_video').get(0);  
video.addEventListener('ended',function(){ 
    video.load();  
},false); 
</script> 

जवाब loganphp के लिए एक शॉर्टकट है कौन सा। वास्तव में जब एक वीडियो टैग के स्रोत को बदलते हैं तो आप निश्चित रूप से लोड() पर कॉल करते हैं।

इस विधि में मीडिया यूआरएल का दोबारा अनुरोध करने के लिए चेतावनी है और कैशिंग सेटिंग्स के आधार पर यह पूर्ण लंबाई के मीडिया संसाधन को फिर से डाउनलोड कर सकता है जिससे क्लाइंट के लिए अनावश्यक नेटवर्क/सीपीयू उपयोग होता है। लेकिन फिर भी यह लॉगनफैप के तरीके से सवाल का जवाब देता है।

यदि आप इस चेतावनी को बाईपास करना चाहते हैं तो आप वीडियो टैग को दिखाने और ओवरले को छिपाने के लिए छवि/div का उपयोग और ओवरले कर सकते हैं और उस पर एक क्लिक/टचस्टार्ट ईवेंट बांध सकते हैं। जब समाप्ति की घटना समाप्त हो जाती है तो बस वीडियो टैग छुपाएं और ओवरले छवि दिखाएं।

0

** वीडियो शुरू ऑटोप्ले और पोस्टर वीडियो के अंत ** पर दिखा

<script src="http://ajax.googleapis.com/ajax/libs/prototype/1.7/prototype.js"></script> 
<body> 
<script type="text/javascript"> 
document.observe('dom:loaded', function(evt){ 
    $$('video').each(function(elm){ 
     elm.play(); 
     var wrapper = elm.wrap('span'); 
     var vid = elm.clone(true); 
     elm.observe('ended', function(){ 
     wrapper.update(vid); 
    }); 
    }); 
}); 

</script> 
<video id="myvideo" poster="1.png" > 
    <source src="1.mp4" type="video/mp4" /> 
</video> 
[HTML5 वीडियो/एक वीडियो पोस्टर का अंत] (की
संबंधित मुद्दे