slide-drive
slide-drive copied to clipboard
Embedding a <video> in a .slide makes everything blow up in Chrome
When I embed a <video>
element inside a .slide
, Chrome hides everything except for a 10-pixel margin around the side of the page.
Firefox does not have an issue.
Possibly related to http://code.google.com/p/chromium/issues/detail?id=75819
Interesting... detaching the video from the DOM and then re-inserting it fixes the issue.
var vid = document.querySelector("video"),
par = vid.parentNode,
placeholder = document.createElement("div");
par.replaceChild(placeholder, vid);
setTimeout(function(){ par.replaceChild(vid, placeholder); }, 0);
That's an easy workaround, even if ugly. Be nice to know what's causing it, though...
That only fixes it temporarily. It may break again if the page is resized.
Commenting out resizeTranscript
fixes the issue. The issue seems to be caused by setting the value of document.getElementById( "slideshow-transcript" ).style.height
, even if the new value is equivalent. (e.g. elem.style.height = +elem.style.height;
, the result is converted from a Number to a String with units, but in the end it has the same value.)