Question

我使用jPlayerscript为我正在制作的网站创建一个mp3播放器。在一个完美运行的独立页面中对其进行测试和设计：

http://www.basenharald.nl/3d/demo-02.htm

但是，如果我在真实的网站上实现它，我无法让控件工作。播放列表也不会完全显示：

http://www.basenharald.nl/3d/（点击“muziek”找到它）除此之外，似乎有效的唯一按钮是播放和暂停。但是当我点击它时，它会跳回到起始屏幕...... 我认为这是由于一些冲突的脚本，但无法找到。

任何人都可以帮忙找到问题吗？

Answer 1

<div id="toppanel">位于播放按钮前...所以当您点击播放时，实际上是单击了toppanel。

你可以做的是，在CSS中的付款人上使用z-index将其向上移动（沿z方向）
将播放器向下移动
删除toppanel

Answer 2

要将所有歌曲显示在播放列表中，请将其添加到style.css文件中：

#muziek .jp-type-playlist li {
    height: 18px;
}

第二个＆lt; li＆gt;标签仍在阻止播放器。使页面的这个区域的标记看起来像这样：

<ul style="{snip... use existing styles}" id="muziek">
    <li style="{snip... use existing styles}">
        <div id="muur-wrapper">
            <!-- mp3 player snipped -->
            <img src="images/muziek-muziek.png" style="position: absolute; left: 251px; top: 300px;">
        </div>
    </li>
</ul>

然后您会注意到点击播放列表中的项目会将您带回主页“页面”。那是因为你在那里有href =“＃”的链接。这是他们正确的行为，但我猜测“＃”最终将被实际mp3文件的链接所取代。无论如何，这应该让玩家的行为与独立演示中的一样。

Answer 3

这一行（在你的“scripts.js”中）似乎是坏苹果：

/*!
 * Smoothscroll
 */
eval((function(){a="Scroller={speed:10,8dC.;d.while(dC.+C.}}...

我检查了原始脚本的源代码（您网站上包含的打包版本是不可读的），并且一条评论提到Smoothscroll抓取文档中的所有锚点并附加click事件以进行滚动。由于jquery播放器使用锚点来控制它，因此存在冲突。

Answer 4

我遇到了冲突脚本的问题，我找不到错误。然后我添加了var $j = jQuery.noConflict();并解决了我的问题。在这里阅读有关jQuery的更多信息没有冲突：http://api.jquery.com/jQuery.noConflict/

我不确定这是否会解决您的问题，但值得尝试。

jquery mp3player - 独立工作，不在网站中

4 个答案: