search

dseif / slide-drive

Slideshow using audio/video to drive content
45 stars 9 forks source link

Embedding a <video> in a .slide makes everything blow up in Chrome #68

Open banksJeremy opened 12 years ago

banksJeremy commented 12 years ago

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.

banksJeremy commented 12 years ago

Possibly related to http://code.google.com/p/chromium/issues/detail?id=75819

banksJeremy commented 12 years ago

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...

banksJeremy commented 12 years ago

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.)