YouTube Video Embedded via iframe Ignoring z-index?

by

Try adding wmode, it seems to have two parameters.

&wmode=Opaque

&wmode=transparent

I can’t find a technical reason why it works, or much more explanation but take at look at this query.

<iframe title="YouTube video player" width="480" height="390" src="http://www.youtube.com/embed/lzQgAR_J1PI?wmode=transparent" frameborder="0" wmode="Opaque">

or this

//Fix z-index youtube video embedding
$(document).ready(function (){
    $('iframe').each(function(){
        var url = $(this).attr("src");
        $(this).attr("src",url+"?wmode=transparent");
    });
});

More Related Contents:

  1. Override body style for content in an iframe
  2. Using CSS to affect div style inside iframe
  3. Making an iframe responsive
  4. overlay opaque div over youtube iframe
  5. how to properly display an iFrame in mobile safari
  6. z-index does not work in Internet Explorer with pdf in iframe
  7. How to apply css to iframe content? [closed]
  8. Safari/Chrome (Webkit) – Cannot hide iframe vertical scrollbar
  9. How do I hide an element when printing a web page?
  10. ::slotted CSS selector for nested children in shadowDOM slot
  11. Aligning grid items across the entire row/column (like flex items can)
  12. How can I force browsers to print background images in CSS?
  13. Is embedding background image data into CSS as Base64 good or bad practice?
  14. How to change an input button image using CSS
  15. Relationship between !important and CSS specificity
  16. Specify an SVG as a background image and ALSO style the SVG in CSS?
  17. Is there a workaround to make CSS classes with names that start with numbers valid? [duplicate]
  18. Difference between static and relative positioning
  19. What bug does zoom:1; fix in CSS?
  20. bootstrap 3 responsive table with fixed first column
  21. box-sizing support in IE7
  22. CSS selector (id contains part of text)
  23. CSS3 ::selection behaves differently in FF & Chrome
  24. Two Divs next to each other, that then stack with responsive change
  25. Fill only Half a star with SVG
  26. Is vertical text-overflow possible with css3?
  27. Why shouldn’t I use position:absolute for positioning everything?
  28. Bootstrap Grid System new line does not look nice
  29. Issues with “background-position” in “background” shorthand property
  30. CSS – Font being blocked from Cross-Origin Resource Sharing Policy

Leave a Comment