Youtube iframe wmode समस्या

Question

JQuery के साथ जावास्क्रिप्ट का उपयोग करते हुए, मैं एक वेबसाइट पर एक वीडियो प्रदर्शित करने के लिए एक youtube url के साथ एक iframe जोड़ रहा हूं, हालांकि एम्बेड कोड जो youtube doesnt से iframe में लोड होता है, उसमें wmode = "Opaque" होता है, इसलिए पृष्ठ पर मोडल बॉक्स दिखाए जाते हैं यूट्यूब वीडियो के नीचे।

किसी भी विचार कैसे मुद्दे को हल करने के लिए?

Comments

क्या यह अभी भी एक मुद्दा है? मैंने पहले इस समाधान का उपयोग किया था लेकिन नवीनतम क्रोम / फ़ायरफ़ॉक्स / IE में मूल मुद्दे को पुन: पेश नहीं कर सकता।

— 17

Answer 1

?wmode=opaqueURL में जोड़ने का प्रयास करें या &wmode=opaqueयदि पहले से ही कोई पैरामीटर है।

अगर यह इसके बजाय कोशिश नहीं करता है, &wmode=transparentजो IE ब्राउज़र में भी काम करेगा।

Comments

अच्छा! फ़ायरफ़ॉक्स और क्रोम पर काम करता है, लेकिन किसी कारण से IE पर काम नहीं करता है ... किसी भी विचार?

— danfromisrael

इसके बजाय & amp; wmode = पारदर्शी का उपयोग करने का प्रयास करें

— Shabith

"& Wmode = xxxx" सेटिंग मानती है कि आप पहले से ही URL में पैरामीटर पारित कर रहे हैं। मैं अपने मामले में नहीं था, इसलिए मुझे इसके बजाय URL में "? Wmode = xxxx" जोड़ना होगा।

— मैट हगिन्स

opaqueऔर के बीच अंतरtransparent । opaqueअधिक प्रदर्शन करने वाला माना जाता है।

— डोनट

शबिथ - "wmode = Opaque" को "wmode = opaque" (लोअरकेस 'o') होना चाहिए

— John

Answer 2

?wmode=transparentURL के अंत में जोड़ने का प्रयास करें। मेरे लिए काम किया।

Comments

मेरी राय में 'पारदर्शी' पसंदीदा विकल्प होना चाहिए।

— फॉक्सिननी

Answer 3

यदि आप नए अतुल्यकालिक एपीआई का उपयोग कर रहे हैं, तो आपको पैरामीटर को इस तरह जोड़ना होगा:

<!-- YOUTUBE -->
// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "http://www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

// 3. This function creates an <iframe> (and YouTube player)
//    after the API code downloads.
var player;
var initialVideo = 'ApkM4t9L5jE'; // YOUR YOUTUBE VIDEO ID
function onYouTubePlayerAPIReady() {
    console.log("onYouTubePlayerAPIReady" + initialVideo);
    player = new YT.Player('player', {
      height: '381',
      width: '681',
      wmode: 'transparent', // SECRET SAUCE HERE
      videoId: initialVideo,      
       playerVars: { 'autoplay': 1, 'rel': 0, 'wmode':'transparent' },
      events: {
        'onReady': onPlayerReady,
        'onStateChange': onPlayerStateChange
      }
    });
}

यह यहां Google प्रलेखन और उदाहरण पर आधारित है: http://code.google.com/apis/youtube/iframe_api_reference.html

Comments

ध्यान दें कि यह ALSO खिलाड़ीवार्स में wmode की आवश्यकता है। जब यह केवल YT.Player के अंतर्गत आता है, तो यह केवल HTML5 प्लेयर के लिए काम करेगा। प्लेयरवार्ड में wmode जोड़ने से वह पैरामीटर फ्लैश ऑब्जेक्ट को भी भेजता है, जिसकी अपनी जेड-ऑर्डर समस्या है। यहाँ देखें: group.google.com/forum/?fromgroups# .topic / youtube-api-gdata/… मैं आपके उत्तर को तदनुसार संपादित करूँगा।

— डायलन मैक्कल

मैंने यह कोशिश की और यह काम नहीं किया। YouTude प्रलेखन में मुझे wmode का कोई संदर्भ नहीं मिला।

— संकिस

जब से मैंने पहली बार पोस्ट किया, लिंक बदल गया, जैसा कि wmode सेट करने की विधि थी। आप किसी भी फ़्लैश पैरामीटर को अब या youtube प्लेयर पैरामीटर प्लेयर वीयर के माध्यम से सेट कर सकते हैं। मैंने उपरोक्त उदाहरण को अपडेट किया है।

— प्लास्टिक स्टर्जन

एक मान को बदलने के लिए संपूर्ण API लोड करना जो URL में आसानी से बदला जा सकता है, कुल ओवरकिल है। यह प्रयोग न करें।

— फ्रीगर्ल

हममें से कुछ ऐसे हैं जो क्रोमलेस खिलाड़ी के साथ काम करते हैं और पहले से ही UI को नियंत्रित करने के लिए JS API का उपयोग करते हैं। हमारे लिए, यह समाधान पूरी तरह से चट्टानों! धन्यवाद

— maxijb

Answer 4

?wmode=opaqueURL में जोड़ना मेरे लिए इस समस्या को हल करने के लिए लगता है, हालांकि मैंने IE में अभी तक इसका परीक्षण नहीं किया है।

उन लोगों के लिए जो पहले से प्रस्तावित समाधान से परेशान हैं, ध्यान दें कि एक inital ampersand केवल तभी काम करेगा जब आप पहले से ही URL के लिए अन्य तर्कों की आपूर्ति कर रहे हों। पहले तर्क में प्रारंभिक प्रश्न चिह्न होना चाहिए:http://www.example.com?first=foo&second=bar

Comments

मुझे शुरू में एक ब्लैक रेक्टेंगल मिल रहा था, वीडियो की परवाह किए बिना मैं दिखाने की कोशिश कर रहा था .. पता चला कि परीक्षण मशीन स्थापित नहीं हुई थी और फ्लैश स्थापित करने के लिए संवाद बहुत अधिक था!

— जेब

Answer 5

&wmode=transparentयूआरएल में जोड़ें और आप कर रहे हैं, परीक्षण किया।

मैं उस तकनीक का उपयोग अपने वर्डप्रेस प्लगइन YouTube शोर्ट में करता हूं

यदि आप किसी भी मुद्दे का सामना करते हैं तो उसके स्रोत कोड की जाँच करें

Comments

ट्यूब URL जोड़ने के बाद आप सभी ब्राउज़र में समस्या का समाधान कर सकते हैं। मि। ट्यूबल, गुड जॉब के लिए धन्यवाद :)

Answer 6

बस एक टिप! - सुनिश्चित करें कि आप उस तत्व पर जेड-इंडेक्स बनाते हैं जिसे आप एम्बेडेड वीडियो पर होना चाहते हैं। मैंने wmode querystring को जोड़ा, और यह तब भी काम नहीं किया ... जब तक कि मैंने दूसरे तत्व के z- इंडेक्स को छीन नहीं लिया। :)

Answer 7

&wmode=opaqueमेरे लिए काम नहीं किया (क्रोम 10) लेकिन &wmode=transparentइस मुद्दे को ठीक किया।

Answer 8

मुझे पता है कि यह एक पुराना सवाल है, लेकिन यह अभी भी इस मुद्दे के लिए शीर्ष खोजों में आता है इसलिए मैं IE के लिए एक की तलाश करने वालों की मदद करने के लिए एक नया उत्तर जोड़ रहा हूं:

&wmode=opaqueURL के अंत में जोड़ना IE 10 में काम नहीं करता है ...

हालाँकि, जोड़ ?wmode=opaqueचाल करता है!

---

यहाँ इस समाधान मिला: http://alamoxie.com/blog/web-design/stop-iframes-covering-site-elements

Comments

&और ?दोनों सही हैं कि वे किस क्रम में उपयोग किए जाते हैं और URL में अन्य सेटिंग्स शामिल हैं। स्पष्ट रूप ?से उपयोग किया जाता है यदि यह पहली (या केवल) सेटिंग है, &अन्यथा।

— एलेक्स

हां, लेकिन IE की विशेष आवश्यकताएं हैं। बस इसे आज़माएं और देखें कि IE 10 में कौन सा काम करता है और कौन सा नहीं। मैं IE 11 में अभी तक यह कोशिश नहीं की है।

— अंबर जून

Answer 9

हाल ही में मैंने देखा कि कभी-कभी फ्लैश प्लेयर पहचान नहीं करता है &wmode=opaque, इसलिए आपको &WMode=opaqueभी पास होना चाहिए (अपरकेस को नोटिस करें)।