FF3/Windows CSS z-index problème avec le lecteur YouTube

Je suis bloqué sur ce qui semble être un CSS/z-index conflit avec le lecteur YouTube. Dans Firefox 3 sous Windows XP, jetez un oeil à cette page: http://spokenword.org/program/21396 Cliquez sur le bouton "encaisser" et note que le pop-up <div> s'affiche sous le lecteur YouTube. Sur d'autres navigateurs le <div> s'affiche sur le dessus. Il a un z-index de la valeur de 999999. J'ai essayé de réglage de la z-index de la <object> élément contenant le lecteur à une valeur plus faible, mais cela ne fonctionne pas. Aucune idée de la façon d'obtenir le pop-up sur le joueur?

Quelle version de Flash utilisez-vous?

InformationsquelleAutor Doug Kaye | 2008-11-28

100

Essayez d'ajouter le wmode paramètre à opaque comme ceci:

(À noter qu'il est inclus dans les deux un <param> tag et un wmode attribut sur la <embed> balise.)
```
<object width='425' height='344'> 
    <param name='movie' value='http://www.youtube.com/v/Wj_JNwNbETA&hl=en&fs=1'> 
    <param name='type' value='application/x-shockwave-flash'> 
    <param name='allowfullscreen' value='true'> 
    <param name='allowscriptaccess' value='always'> 
    <param name="wmode" value="opaque" />
    <embed width='425' height='344'
            src='http://www.youtube.com/v/Wj_JNwNbETA&hl=en&fs=1'
            type='application/x-shockwave-flash'
            allowfullscreen='true'
            allowscriptaccess='always'
            wmode="opaque"
    ></embed> 
    </object> 
```
- Ha! Qu'il a fait. Je vais le lire pour voir pourquoi. Aurait pensé qu'en rendant le joueur opaque pourrait avoir l'effet inverse si quoi que ce soit. Excellent!
- +1 je souhaite que j'ai vu cette question il ya 2 jours 🙂
- +1! Ce qui m'a sauvé la vie! Merci, très bien!
- Il suce que ad-réseaux ne sont pas, et REFUSE parfois de, faire. Ils veulent que leurs annonces hémorragie à travers...
- Que le code a fonctionné pour moi sous IE mais pas sous firefox. J'ai le même code.
- Terriblement épargnant de vie 🙂
- J'adore ce site.
- Grâce à la CMS, a besoin de cette
InformationsquelleAutor CMS
15

bien que la recommandation formulée par la CMS est valide, il y a une mise à jour importante. Si vous souhaitez utiliser 'iframe' au lieu de 'embed' , il suffit d'ajouter ?wmode=transparent à votre lien vidéo et qui fait la magie. Je trouve cela plus simple et propre.

Mise À Jour, Févr 2014

Il a été un moment et c'est peut-être obsolète.

Quelqu'un a signalé que maintenant &wmode=transparent œuvres au lieu.
- Qui fonctionne vraiment bien, ile! Où avez-vous trouvez sur la mise à jour?
- C'est la plus pertinente réponse, puisque personne n'utilise YouTube embed plus. Merci!
- Super! Merci! En effet, c'est aujourd'hui la réponse pertinente 🙂
- D'accord. Celui-ci devrait être sur le dessus.
InformationsquelleAutor ılǝ

j'ai trouvé un pur JS fonction de fixer dans tous les navigateurs!

là vous allez:

function fix_flash() {
//loop through every embed tag on the site
var embeds = document.getElementsByTagName('embed');
for (i = 0; i < embeds.length; i++) {
embed = embeds[i];
var new_embed;
//everything but Firefox & Konqueror
if (embed.outerHTML) {
var html = embed.outerHTML;
//replace an existing wmode parameter
if (html.match(/wmode\s*=\s*('|")[a-zA-Z]+('|")/i))
new_embed = html.replace(/wmode\s*=\s*('|")window('|")/i, "wmode='transparent'");
//add a new wmode parameter
else
new_embed = html.replace(/<embed\s/i, "<embed wmode='transparent' ");
//replace the old embed object with the fixed version
embed.insertAdjacentHTML('beforeBegin', new_embed);
embed.parentNode.removeChild(embed);
} else {
//cloneNode is buggy in some versions of Safari & Opera, but works fine in FF
new_embed = embed.cloneNode(true);
if (!new_embed.getAttribute('wmode') || new_embed.getAttribute('wmode').toLowerCase() == 'window')
new_embed.setAttribute('wmode', 'transparent');
embed.parentNode.replaceChild(new_embed, embed);
}
}
//loop through every object tag on the site
var objects = document.getElementsByTagName('object');
for (i = 0; i < objects.length; i++) {
object = objects[i];
var new_object;
//object is an IE specific tag so we can use outerHTML here
if (object.outerHTML) {
var html = object.outerHTML;
//replace an existing wmode parameter
if (html.match(/<param\s+name\s*=\s*('|")wmode('|")\s+value\s*=\s*('|")[a-zA-Z]+('|")\s*\/?\>/i))
new_object = html.replace(/<param\s+name\s*=\s*('|")wmode('|")\s+value\s*=\s*('|")window('|")\s*\/?\>/i, "<param name='wmode' value='transparent' />");
//add a new wmode parameter
else
new_object = html.replace(/<\/object\>/i, "<param name='wmode' value='transparent' />\n</object>");
//loop through each of the param tags
var children = object.childNodes;
for (j = 0; j < children.length; j++) {
try {
if (children[j] != null) {
var theName = children[j].getAttribute('name');
if (theName != null && theName.match(/flashvars/i)) {
new_object = new_object.replace(/<param\s+name\s*=\s*('|")flashvars('|")\s+value\s*=\s*('|")[^'"]*('|")\s*\/?\>/i, "<param name='flashvars' value='" + children[j].getAttribute('value') + "' />");
}
}
}
catch (err) {
}
}
//replace the old embed object with the fixed versiony
object.insertAdjacentHTML('beforeBegin', new_object);
object.parentNode.removeChild(object);
}
}
}

maintenant, vous pouvez simplement exécuter lorsque le chargement de la page avec jQuery:

 $(document).ready(function () {
fix_flash();    
});

Je souhaite que j'avais vu que le mois dernier, quand je cherchais quelque chose comme ça! Ma recherche n'a jamais trouvé cette page. Fini par écrire quelque chose de presque exactement la même chose!
A travaillé comme annoncé. Merci!!!!
Attention cependant, cette solution car il est la volonté de cacher des objets Flash sur IE<9
hey fandelost. il travaille toujours pour moi. je l'ai utilisé ici: skydiveinisrael.com et tout semble bon. regarder la vidéo youtube dans le milieu et appuyez sur l'une des photos sur le côté. vous verrez l'image de la pop au-dessus de la flash qui est exactement le résultat voulu...
Soyez prudent si vous manquez une ); sur votre document.prêt script

InformationsquelleAutor danfromisrael

3

Nous utilisons jQuery Flash plugin pour convertir des liens YouTube vers des animations Flash. Dans ce cas, wmode est passé comme une option pour obtenir la vidéo sur YouTube pour apparaître sous le jQuery boîte de Dialogue de nous ouvrir:
```
$('a[href^="http://www.youtube.com"]').flash(
{ width: nnn, height: nnn, wmode: 'opaque' }
);
```
InformationsquelleAutor Matthew Kuehn
1

J'ai remarqué que wmode="opaque" terriblement affecte l'utilisation de l'UC.
Chrome rendre sur mon bloc-notes de 50% d'utilisation du PROCESSEUR (sans opaque ~8%).

Soyez donc prudent avec cette option.

InformationsquelleAutor Wojciech Kulik

Vous devez vous connecter pour publier un commentaire.