我正在尝试使用jPlayer从网址嵌入视频文件。
这是我正在使用的代码。这在Chrome和Firefox中完全正常,但在Internet Explorer 7,8或9中没有。显示视频框,它在视频框下显示错误消息。
jPlayer Developer Guide表示它支持IE 7及更高版本。
那么问题是什么?
我为此尝试了html5 vidoe标签,但IE 8及以下版本也不支持。
<html>
<head>
<!--Stylesheets-->
<link rel="stylesheet" href="css/styles.css"/>
<!--jQuery-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<!--jPlayer-->
<script src="js/jquery.jplayer.min.js"></script>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
</head>
<body>
<div style="margin-left:50px;" >
<a href="https://www.google.com">
<img src="back.jpg" width="64px" height="64px" alt=""/>
</a>
</div>
<!--container for everything-->
<div id="jp_container_1" class="jp-video jp-video-360p">
<!--container in which our video will be played-->
<div id="jquery_jplayer_1" class="jp-jplayer"></div>
<!--main containers for our controls-->
<div class="jp-gui">
<div class="jp-interface">
<div class="jp-controls-holder">
<!--play and pause buttons-->
<a href="javascript:;" class="jp-play" tabindex="1">play</a>
<a href="javascript:;" class="jp-pause" tabindex="1">pause</a>
<span class="separator sep-1"></span>
<!--progress bar-->
<div class="jp-progress">
<div class="jp-seek-bar">
<div class="jp-play-bar"><span></span></div>
</div>
</div>
<!--time notifications-->
<div class="jp-current-time"></div>
<span class="time-sep">/</span>
<div class="jp-duration"></div>
<span class="separator sep-2"></span>
<!--mute / unmute toggle-->
<a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a>
<a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a>
<!--volume bar-->
<div class="jp-volume-bar">
<div class="jp-volume-bar-value"><span class="handle"></span></div>
</div>
<span class="separator sep-2"></span>
<!--full screen toggle-->
<a href="javascript:;" class="jp-full-screen" tabindex="1" title="full screen">full screen</a>
<a href="javascript:;" class="jp-restore-screen" tabindex="1" title="restore screen">restore screen</a>
</div><!--end jp-controls-holder-->
</div><!--end jp-interface-->
</div><!--end jp-gui-->
<div class="jp-no-solution">
<span>Update Required</span>
Here's a message which will appear if the video isn't supported. A Flash alternative can be used here if you fancy it.
</div>
</div><!--end jp_container_1-->
<!--instantiate-->
<script type="text/javascript">
$(document).ready(function(){
$("#jquery_jplayer_1").jPlayer({
ready: function () {
$(this).jPlayer("setMedia", {
webmv: "Big_Buck_Bunny_Trailer.webm",
poster: "Big_Buck_Bunny_Trailer_480x270.png"
});
},
swfPath: "js",
supplied: "webmv",
size: {
width: "570px",
height: "340px",
cssClass: "jp-video-360p"
}
});
});
</script>
</body>
</html>
答案 0 :(得分:0)
Internet Explorer不支持WebM视频格式。 在这种情况下,JPlayer使用“Flash Fallback”方法,即它使用Flash Player为流提供不支持的视频格式。 因此,要在Internet Explorer中可视化WebM视频,需要安装Flash Player。