Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 09.10.2016, 19:50
Интересующийся
Отправить личное сообщение для denkoh Посмотреть профиль Найти все сообщения от denkoh
 
Регистрация: 22.07.2012
Сообщений: 21

Аудио-плеер "Жуэль"
Доброго времени суток Господа! Вот тут нарыл в сети аудио-плеер, очень понравился, но в нем нет кнопочки для скачивания трека, к примеру как здесь. Может кто поможет добавить детальку, я то сам в этом деле не бу-бум. Да Святится имя того, кто поможет!
Ответить с цитированием
  #2 (permalink)  
Старый 10.10.2016, 11:11
Аватар для Опан
Кандидат Javascript-наук
Отправить личное сообщение для Опан Посмотреть профиль Найти все сообщения от Опан
 
Регистрация: 15.03.2013
Сообщений: 100

Вот URL, по которому находится набор кнопок:
http://qwebs.ru/bitrix/js/qwebs.joue...ele-sprite.png
Как с помощью кода подставить нужную кнопку, я забыл (хотя и не знал). Можете скачать, вырезать нужную кнопку с помощью Paint и использовать в качестве ссылки на скачивание:
<div class="example-track">
	<h3 class="example-track-header">data-length="9:54"<br/>"594" also will work (as 9×60 + 54)</h3>
	<a href="http://audio.ilyabirman.ru/Ilya%20Birman%20-%20News.mp3" class="jouele" data-length="9:54">Ilya Birman – News1</a>
	<a href="http://audio.ilyabirman.ru/Ilya%20Birman%20-%20News.mp3"><img src="download.png"></a>
</div>

Помните об авторских правах на музыку, эта кнопка может усложнить их соблюдение

Последний раз редактировалось Опан, 10.10.2016 в 11:30.
Ответить с цитированием
  #3 (permalink)  
Старый 10.10.2016, 18:44
Интересующийся
Отправить личное сообщение для denkoh Посмотреть профиль Найти все сообщения от denkoh
 
Регистрация: 22.07.2012
Сообщений: 21

Спасибо конечно добрый человек, но это не то Дело в том, что ссылка на mp3 файл с классом class="jouele" становится плеером, а по вашему предложению, добавляется еще одна ссылка, в итоге если у меня на странице будет 50 ссылок на mp3, то их число удвоится, вряд ли поисковикам такое понравится, да и кнопочка получилась под плеером, а не рядом с таймером.

В подобном плеере, в JS, кнопочка вшита таким образом:

$ (thisSelector).find ('.jouele-info-area').append (
      $ ('<a class="jouele-download jouele-hidden" style="display: none"></a>'),
      $ ('<div class="jouele-play-control"></div>'),
      $ ('<div class="jouele-time"></div>'),
      $ ('<div class="jouele-name">' + thisName + '</div>')
    )


$ (thisSelector).find ('.jouele-download').attr (
          'href',
          $aHref.attr ('href')
        )


* .jouele-download, .jouele-skin-dark .jouele-download {
    background-position: -48px;

.jouele-download {
    position: absolute;
    right: 0;
    top: -1px;
    width: 16px;
    height: 16px;
    margin-left: 8px;
    margin-right: -3px;
    border: none;
    text-decoration: none;
}

.jouele-unavailable, .jouele-play, .jouele-pause, .jouele-download {
    background: 16px center;
    background: url("i/jouele-sprite.png") no-repeat;
    background: rgba(0, 0, 0, 0) url("i/jouele-sprite.svg") no-repeat;
    background-repeat: no-repeat;
}

Последний раз редактировалось denkoh, 10.10.2016 в 18:48.
Ответить с цитированием
  #4 (permalink)  
Старый 10.10.2016, 18:46
Интересующийся
Отправить личное сообщение для denkoh Посмотреть профиль Найти все сообщения от denkoh
 
Регистрация: 22.07.2012
Сообщений: 21

А на плеере что мне нужен, сам черт ноги сломает:

Воть!

Эх, может все-таки найдется гений который поможет

Последний раз редактировалось denkoh, 10.10.2016 в 18:56.
Ответить с цитированием
  #5 (permalink)  
Старый 10.10.2016, 20:20
Аватар для Опан
Кандидат Javascript-наук
Отправить личное сообщение для Опан Посмотреть профиль Найти все сообщения от Опан
 
Регистрация: 15.03.2013
Сообщений: 100

Там за вывод кнопки отвечает вторая строка Вашего первого JS-кода. Как-то нужно встроить её.
Ответить с цитированием
  #6 (permalink)  
Старый 10.10.2016, 23:17
Аватар для Опан
Кандидат Javascript-наук
Отправить личное сообщение для Опан Посмотреть профиль Найти все сообщения от Опан
 
Регистрация: 15.03.2013
Сообщений: 100

Сначала приведите в человеческий вид содержимое файла jouele.js с помощью деобфускатора http://jsbeautifier.org/
Должно получиться, что 277 строка имеет такое содержимое: .html(u))]
Между двумя скобками, которые я выделил красным, вставляете это:
, e(document.createElement("div")).html("<a href=''><img src='download.png'></a>")

Появится кнопка. Но опять же под названием трека, а не в правом конце.
А вот от куда выдрать саму ссылку на скачивание, чтобы не прописывать её в этой строке в атрибуте href, я пока не догнал.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как встроить в HTML стандартный FalshPlayer плеер для проигрывания аудио? Почемучкин Flash 15 11.11.2012 20:43
jquery аудио плеер: плейлист не отображается в firefox roy-aron jQuery 0 27.06.2012 17:20
Mp3 плеер на JavaScript/Flash krisstail Работа 1 26.05.2012 03:00
Проблема при воспроизведении аудио при использовании jplayer nemish Events/DOM/Window 0 01.12.2011 16:15
скрыть плеер за надписью Ageles Работа 0 25.10.2010 16:51