0
FlowPlayerがJavascript配列を取得し、ユーザーがそれをクリックしたときにビデオファイルを実行できるようにするコードがあります。Flowplayerが表示されず、Flowplayerが要素にアクセスできない
しかし、私は2つの問題を抱えて：
- プレイヤーとプレイリストがページに表示されませんでした。
- Flowplayerに関するエラーは要素にアクセスできません。
以下（念のために誰もがビデオの完全なパスがhttp://mm.com/mmA/videoplayer/videos/591483.flvで、尋ねる）完全なコードです：
<%@ Page Language="C#" %>
<html dir="ltr">
<head runat="server">
<META name="WebPartPageExpansion" content="full">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled 1</title>
</head>
<body>
<form id="form1" runat="server">
</form>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<!--<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>-->
<script type="text/javascript" src="videoplayer/jquery.min.js"></script>
<script type="text/javascript" src="videoplayer/flowplayer-3.2.6.min.js"></script>
<script type="text/javascript" src="videoplayer/flowplayer.playlist-3.0.8.min.js"></script>
<style>
/* player style */
/* container has a background image */
a.player {
display:block;
width:500px;
height:340px;
text-align:center;
color:#fff;
text-decoration:none;
cursor:pointer;
background:#000 url(/img/global/gradient/h500.png) repeat-x 0 0;
background:-moz-linear-gradient(top, rgba(55, 102, 152, 0.9), rgba(6, 6, 6, 0.9));
-moz-box-shadow:0 0 40px rgba(100, 118, 173, 0.5);
}
a.player:hover {
background:-moz-linear-gradient(center top, rgba(73, 122, 173, 0.898), rgba(6, 6, 6, 0.898));
}
/* splash image */
a.player img {
margin-top:125px;
border:0;
}
#player {
float:left;
height:325px;
width:425px;
}
/* playlist style */
#playlist {
width:312px;
height:350px;
overflow-y:auto;
overflow-x:hidden;
border:1px solid #ccc;
padding:4px 10px 12px 10px;
background-color:#efefef;
margin-top:20px;
float:left;
}
/* playlist entry */
#playlist a {
display:block;
width:280px;
height:90px;
padding:7px;
background-color:#fff;
border:1px solid #ccc;
font:11px "bitstream vera sans", "lucida grande",verdana;
text-decoration:none;
margin-top:7px;
color:#666;
}
/* different states of a playlist entry */
#playlist a:hover {
background-color:#ffc;
}
#playlist a.progress {
background-color:#efefef;
}
#playlist a.playing {
border:1px solid #666;
background-color:#ffc;
}
#playlist a.paused {
border:1px solid #666;
background-color:#ffc;
}
/* elements inside playlist entry */
#playlist a img {
border:0;
float:left;
margin-right:10px;
}
#playlist a strong {
color:blue;
padding-bottom:5px;
}
#playlist a em {
border:0;
float:left;
margin-right:10px;
background:url(/img/demos/clock.gif) no-repeat 0 50%;
padding-left:20px;
color:#333;
font-style:normal;
margin-top:10px;
}
</style>
<script type="text/javascript">
var push1 = {"url": "videoplayer/videos/591483.flv", "duration": "0.22"};
var push2 = {"url": "videoplayer/videos/581192.flv", "duration": "0.22"};
var MyList = [];
MyList.push(push1);
MyList.push(push2);
$f("player", "http://releases.flowplayer.org/swf/flowplayer-3.1.1.swf", {
// common clip: these properties are common to each clip in the playlist
clip: {
baseUrl: "http://mm.com/mmA/",
// by default clip lasts 5 seconds
duration: 5
},
// playlist with entries
playlist: MyList,
debug: true,
plugins: {
controls: {
// you do not need full path here when the plugin
// is in the same folder as flowplayer.swf
url: "flowplayer.controls-3.1.1.swf",
playlist: true,
backgroundColor: "#aedaff",
tooltips: {
buttons: true,
fullscreen: "Enter Fullscreen mode"
}
}
}
});
</script>
</head>
<body>
<table>
<tr>
<td>
<a id="player" class="player">
<img src="http://static.flowplayer.org/img/player/btn/play_text_large.png" />
</a>
</td>
<td>
</td>
</tr>
</table>
<br clear="all" />
</body>
</html>
は、任意のヘルプの申し出を感謝しています。