0

我的页面上有一个音乐播放器,其代码如下:

<!--SCM Music Player by Adrian C Shum - http://scmplayer.net-->  
<script type="text/javascript" src="http://scmplayer.net/script.js" ></script>  
<script type="text/javascript">  
SCMMusicPlayer.init("{'skin':'skins/black/skin.css','playback':{'autostart':'true','shuffle':'true','volume':'40'},'playlist':[{'title':'2Spooky Battle','url':'http://a.tumblr.com/tumblr_mbdoptQ5LT1rte8jio1.mp3'}], 'onplay': function() {alert('playing');},'placement':'bottom','showplaylist':'false'}");  
</script>  
<!--End of SCM Music Player script-->

我也有两张图片,其代码如下所示:

<html>
<head>
<style type="text/css">

#img1{
  position: fixed;
  right: 10px;
  bottom: 100px;
  z-index: 10;
  visibility:hidden;
}

#img2{
  position: fixed;
  left: 10px;
  top: 10px;
  z-index: 10;
  visibility:hidden;
}

</style>
</head>

<body>
  <img src="IMAGE1.png" id="img1">
  <img src="IMAGE2.png" id="img2">
</body>
</html>

我想这样做,以便在播放器启动时这两个都变得“可见”。我需要添加/取出/替换什么才能使它起作用?

4

3 回答 3

0

使用 jQuery 我会写这个 javascript 代码

<script>
    function ChangeCSS()
    {
        $('#img1').css({ //new css style goes here
                         z-index : 10 
                      });
</script>
// in your init method there is onPlay method use it to call this function.
于 2012-10-05T20:15:35.900 回答
0

这将取决于 SCMPlayer 是否让您能够指定“回调”,这本质上是播放器在特定事件发生时调用的一段代码。

另一种方法是使用一组外部控件来管理播放器,并将您的代码附加到其中。SCMPlayer 的文档 (http://scmplayer.net/#api) 提供了有关如何通过单击调用播放/暂停的说明。您可以调整它以调用自定义函数,该函数适当地设置项目的可见性。

尽管您没有在原始问题中指定它,但 jQuery 使像这样的 DOM 元素的操作非常容易。你会想看看它是否适合你的情况。:)

于 2012-10-05T20:18:33.467 回答
0

有一个 onPlay 回调。您可能可以使用它。

未经测试的示例代码:

function displayElement(id) {
    document.getElementById(id).style.visibility = 'visible';
}

onplay: function() {
    displayElement('img1');
    displayElement('img2');
}
于 2012-10-05T20:19:39.607 回答