2011-05-03 121 views
0

我有一个小的jQuery .click函数,我打算用它来跳过HTML5视频,并在它的位置开始照片幻灯片放映。这是如下:jQuery fn暂停HTML 5视频在Flash后备中损坏

$("a.skip").click(function() { 
    $("div.vidbox video").hide();     
    $("div.vidbox div").hide(); 
    $(".slideshow").fadeIn(1000, function() {setInterval("slideSwitch()", 5000)}); 
    $("div.vidbox video").get(0).pause(); 
    return false; 
}); 

这与以下标记的工作:

<video width="1000" height="400" preload="auto" controls="controls" poster="a/i/pe_home_poster.jpg" style="display: none;"> 
    <source src="a/v/pre-launch-welcome-video.mp4" type="video/mp4" /> 
    <source src="a/v/pre-launch-welcome-video.ogg" type="video/ogg" /> 
    <object id="flowplayer" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="1000" height="400"> 
     <param name="movie" value="a/flowplayer/flowplayer-3.2.7-0.swf" /> 
     <param name="flashvars" 
      value='config={"clip":"http://www.clientsite.com/a/v/pre-launch-welcome-video.mp4"}' />     
     <embed type="application/x-shockwave-flash" width="1000" height="400" 
      src="a/flowplayer/flowplayer-3.2.7-0.swf" 
      flashvars='config={"clip":"http://www.clientsite.com/a/v/pre-launch-welcome-video.mp4"}'/> 
    </object>    
</video> 

然而,问题是,当浏览器回落到基于闪存的播放器,暂停函数返回未定义,并打破脚本。

现在,我已经通过调用click函数底部附近的暂停函数来减轻效果,所以只有返回失败,但我认为我可以做得更好。

我想从这里得到什么是要么我可以使条件有条件,和/或如何检测使用jQuery实际播放哪个视频。感谢任何有意见的人。

回答

1

你可以测试一下,看看浏览器是否支持视频

var supportsVideo = !!(document.createElement('video').canPlayType); 

if (supportsVideo) { 
$("div.vidbox video").get(0).pause(); 
} 
+0

这工作! 谢谢!我喜欢这个技巧。我不会忘记它。 – DaveL 2011-05-03 20:12:43

+0

如果您需要对浏览器功能进行更多测试,请确保您查看Modernizer http://www.modernizr.com/ – 2011-05-03 20:35:02