jquery mp3player - работает автономно, а не на сайте - PullRequest
Новая
       30

jquery mp3player - работает автономно, а не на сайте

6 голосов
/ 11 июля 2011

Я использовал jPlayerscript, чтобы создать mp3-плеер для сайта, который я делаю. Протестировано и оформлено на отдельной странице, где она отлично работает:

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

Однако, если я реализую это на реальном веб-сайте, я не смогу заставить работать элементы управления. Также не будет полностью отображаться плейлист:

http://www.basenharald.nl/3d/ (нажмите "muziek", чтобы найти его) Кроме того, единственная кнопка, которая, кажется, работает - игра и пауза. Но когда я нажимаю на это, он возвращается на стартовый экран ... Я думаю, что это из-за некоторых конфликтующих скриптов, но не могу найти где.

Может кто-нибудь помочь найти проблему?

Ответы [ 4 ]

5 голосов
/ 11 июля 2011

<div id="toppanel"> находится перед кнопкой воспроизведения ... поэтому, когда вы нажимаете на игру, вы фактически нажимаете верхнюю панель.

  • Что вы можете сделать, это использовать z-index на плательщике в CSS, чтобы переместить его вверх (в направлении z)
  • переместить игрока вниз
  • Снимите топпанель
1 голос
/ 21 июля 2011

Эта строка (в вашем "scripts.js") кажется плохим яблоком: 

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

Я извлек исходный код оригинального сценария (упакованная версия, которую вы включили на своем сайте, невозможно прочитать), и в одном комментарии упоминается, что Smoothscroll захватывает все якоря в документе и присоединяет событие click для прокрутки. Поскольку проигрыватель jquery использует якоря для управления, существует ваш конфликт.

1 голос
/ 20 июля 2011

Чтобы все песни отображались в вашем плейлисте, добавьте их в файл style.css: 

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

Второй тег

по-прежнему блокирует проигрыватель.Сделайте так, чтобы разметка в этой области страницы выглядела следующим образом: 
<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-файлы.В любом случае это должно привести к тому, что игрок будет вести себя так же, как в вашей демонстрационной версии.

0 голосов
/ 15 июля 2011

У меня была проблема с конфликтующими сценариями, и я не смог найти ошибку. Затем я добавил var $j = jQuery.noConflict();, и это исправило мои проблемы. Подробнее о jQuery читайте здесь: http://api.jquery.com/jQuery.noConflict/

Я не уверен, решит ли это вашу проблему, но стоит попробовать.

...