2012-03-15 18 views
8

का समर्थन नहीं करता है तो मैं एक छवि कैसे प्रदर्शित कर सकता हूं क्या कोई जानता है कि मैं उन ब्राउज़र के लिए एक छवि कैसे प्रदर्शित कर सकता हूं जो टैग का समर्थन नहीं करते हैं? ऐसे में किसी पाठ प्रदर्शित:यदि ब्राउज़र एचटीएमएल 5 के <video> टैग

<video src="video.mp4" type="video/mp4"> 
    Your browser does not support the <video> tag 
</video> 

आसान है, लेकिन अगर मैं एक img टैग के साथ पाठ की जगह है, यह हमेशा छवि प्रदर्शित करेगा, तब भी जब ब्राउज़र वीडियो टैग का समर्थन करता है।

अपने ज्ञान को साझा

(संपादित) यह मामला नहीं है, मेरे परीक्षण गलत थे और img टैग वास्तव में केवल प्रदान की गई हो जाता है जब वीडियो समर्थित नहीं है (उदाहरण के लिए सफारी 5) के लिए धन्यवाद

उत्तर

14

मैं सिर्फ था this link जांच की जाएगी, HTML5's spec के रूप में है, इसलिए इस कोड आप के लिए काम करना चाहिए:

<video controls="controls" poster="<your image poster if applicable>"> 
    <source src="video.mp4" type="video/mp4" /> 
    <img src="<your No video support image>" title="Your browser does not support the <video> tag" /> 
</video> 
+0

धन्यवाद, हाँ यह काम करता है! मेरा सवाल वास्तव में गलत है, मेरे द्वारा परीक्षण किए गए ब्राउज़र टैग केवल तभी प्रदर्शित होंगे जब

+0

दिसंबर 2015 तक, img 'src' gifs का समर्थन नहीं करता है। यदि आप फ़ॉलबैक gif चाहते हैं, तो [पोस्टर] (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video) विशेषता देखें। मैंने एक उदाहरण के साथ एक [ब्लॉग पोस्ट] लिखा है (https://nishanths.github.io/blog/gif-fallback-html5-video/)। – nishanths

3

जावास्क्रिप्ट का उपयोग करना, आप चला सकते हैं:

var html5video = !!document.createElement('video').canPlayType; 

यह आपके समर्थन के आधार पर सत्य या गलत होगा या नहीं। फिर आप किसी वीडियो के साथ वीडियो टैग को प्रतिस्थापित करने के लिए जावास्क्रिप्ट का उपयोग कर सकते हैं, या आसान, बस वीडियो को display:none; पर सेट करें और छवि display:block; या इसके विपरीत।

+0

जो मुझे लगता है कि काम भी करेगा, लेकिन ऊपर जवाब सरल है। – mpaf

+0

मुझे लगता है कि आपने कोशिश की थी और यह काम नहीं किया! ओह ठीक है, जब कभी मैं उपयोग कर सकते हैं !! (बैंग बैंग) यह मुझे खुश बनाता है! –