我刚刚在这里为我的网站下载了音乐播放器: http://www.codebasehero.com/2011/06/html-music-player/
但div不会显示在我的区块中。
例如,我将脚本放在两个div之间,但脚本在所有MY div之后创建了自己的div。
<?php include('entete-player.php'); ?>
<div id="CONTENT">
<h1>Connexion</h1>
<div id="TEXT">
<script type="text/javascript">
$(document).ready(function(){
var description = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce id tortor nisi. Aenean sodales diam ac lacus elementum scelerisque. Suspendisse a dui vitae lacus faucibus venenatis vel id nisl. Proin orci ante, ultricies nec interdum at, iaculis venenatis nulla. ';
$('body').ttwMusicPlayer(myPlaylist, {
autoPlay:false,
description:description,
jPlayer:{
swfPath:'player/plugin/jquery-jplayer' //You need to override the default swf path any time the directory structure changes
}
});
});
</script>
</div>
</div>
<?php include ('pied.php'); ?>
这是我的标题,
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Under Shift - Site Officiel</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link href="images/styles.css" rel="stylesheet" type="text/css" />
<link rel="icon" href="images/favicon.ico" />
<link rel="stylesheet" type="text/css" href="player/plugin/css/style.css"/>
<link rel="stylesheet" type="text/css" href="player/demo/css/demo.css"/>
<script type="text/javascript" src="player/demo/js/jquery-1.6.1.min.js"></script>
<script type="text/javascript" src="player/plugin/jquery-jplayer/jquery.jplayer.js"></script>
<script type="text/javascript" src="player/plugin/ttw-music-player-min.js"></script>
<script type="text/javascript" src="player/demo/js/myplaylist.js"></script>
</head>
这是我在开发控制台中看到的:
<html></html>
<head></head>
<body>
<div id="HEADER">...</div>
<div id="CONTENT">...</div>
<div id="FOOTER">...</div>
<div id="pluginInstalledv2">...</div>
<div class="ttw-music-player" style="opacity: 1;">...</div>
</body>
</html>
这就是我想要的:
<html></html>
<head></head>
<body>
<div id="HEADER">...</div>
<div id="CONTENT">
<div id="pluginInstalledv2">...</div>
<div class="ttw-music-player" style="opacity: 1;">...</div>
</div>
<div id="FOOTER">...</div>
</body>
</html>
答案 0 :(得分:1)
为了让它以你想要的方式显示(至少在代码中),在上面的javascript(jQuery)中,有一行看起来像这样
$('body').ttwMusicPlayer(myPlaylist, {
将其更改为
$('#pluginInstalledv2').ttwMusicPlayer(myPlaylist, {
这将使播放器至少在代码中出现在您想要的位置。然后从那里开始根据需要进行定位或其他任何方式。
编辑*** 为了更好地解释,那条线,它说“身体”告诉脚本将玩家加载到身体的任何地方。
当您将“body”更改为“pluginInstalledv2”时,这是我假设玩家所在的名称,它会将玩家置于该div中。
之后你需要做的就是设计风格吧。
祝你好运,希望这适合你。