I embed videos into my web site, works great in all browsers but on firefox shows up a black screen, any idea? Using the iframe mode. Funniest thing is that some show up and some don't using the same embed method for all.
问题:
回答1:
rob.m - yup, showing and hiding vimeo videos will cause that random black screen to appear. I JUST ran into this on a project, and tore my hair out for the better part of a day figuring out why.
If you NEED to show/hide videos, and you NEED the black screen to not show up, you will have to use the old school flash embed. That will work.
It's a trade off - consistent embed images = flash OR inconsistent embed images = universal method (read: HTML5 w/ flash fallback).
[Brief rant: the Vimeo API documentation leaves a LOT to be desired]
If you need to further interact with these videos that you show/hide, and plan to use the Vimeo API to do so, I found that I had to use the SWFobjects library method. See this forum post for more: http://vimeo.com/forums/topic:44521 - specifically, the second to last post.
回答2:
from vimeo api:
"Note: if your site will contain a Universal Player embed, but won't show it right away, it's best to not to include the embed code until the video is ready to be displayed. There are bugs in some browsers that prevent the proper initialization of the player if it is initially hidden."
which may be my problem as its container box is first hidden and then .show() applied to it.
回答3:
Eventually i came up with using this:
In the main page I have a element which i then populate and replace with the iframe. Thanks
Main page:
<span class="video clearfix" data-vimeoid="<?php echo the_field('vimeo') ?>"></span>
Content page to be loaded:
var url = this.href + " .content"; var videoSpan = infoBox.find("span.video"); var iframe = $('<iframe/>', { 'frameborder' : 0, 'width' : '692', 'height' : '389', 'src' : 'http://player.vimeo.com/video/'+ videoSpan.data("vimeoid") +'?autoplay=0&api=1' }); videoSpan.replaceWith(iframe);