ОсновноеRadiotalkПользовательское
Общие вопросы по интернет радио вещанию
6   •   Посмотреть все темы

Плеер HTML5 помощь

 

120
Александр @Aleksandr_Boyko
Здравствуйте, нужна ваша помощь в стилизации самого простого аудио плеера. Вот есть код

<audio id="audio" src="http://free.radioheart.ru:8000/bvrfm" controls ></audio>
<button onclick="document.getElementById('audio').play()">Play</button>
<button onclick="document.getElementById('audio').pause()">Pause</button>
<button onclick="document.getElementById('audio').volume+=0.1">Vol +</button>
<button onclick="document.getElementById('audio').volume-=0.1">Vol -</button>

Нажмите и перетащите
плеер выглядит вот так:

Помогите пожалуйста поставить вместо кнопок "play" "payse" "vol+" "vol-" картинки возпроизведения и громкости если нужно то я сброшу картинки.!) очень надеюсь на вашу помощь

6245
Тарас @tarasian666
это не совсем по адресу...

120
Александр @Aleksandr_Boyko
tarasian666 пишет:

это не совсем по адресу...

а куда написать? здесь всё таки помошь...

888
Falcon @Falcon
Вместо

<button onclick="document.getElementById('audio').play()">Play</button>

Делаете

<img src="путь до картинки" onclick="document.getElementById('audio').play()" />


Аналогично и с другими кнопками

120
Александр @Aleksandr_Boyko
Falcon пишет:

Вместо

<button onclick="document.getElementById('audio').play()">Play</button>

Делаете

<img src="путь до картинки" onclick="document.getElementById('audio').play()" />


Аналогично и с другими кнопками

Есть с этим разобрался, а как теперь сделать взаимо заменяемость, я нажимаю плей вместо неё появляется пауза? и как убрать вот это

120
Александр @Aleksandr_Boyko
до меня дошло как это сделать ,вообщем получилось вот так <audio id="audio" src="http://free.radioheart.ru:8000/bvrfm" controls ></audio>
<img src="http://margchat.at.ua/img/Play-icon-Azul.png" onclick="if (this.src=='http://margchat.at.ua/img/Play-icon-Azul.png') {this.src='http://margchat.at.ua/img/PauseDisabled.png'; document.getElementById('audio').play() } else { this.src='http://margchat.at.ua/img/Play-icon-Azul.png'; document.getElementById('audio').pause() };" />
</h2>


Но как убрать вот это

888
Falcon @Falcon

<audio id="audio" src="http://free.radioheart.ru:8000/bvrfm" controls style="display:none"></audio>

или

<audio id="audio" src="http://free.radioheart.ru:8000/bvrfm" controls style="visibility:hidden"></audio>

120
Александр @Aleksandr_Boyko
Falcon пишет:


<audio id="audio" src="http://free.radioheart.ru:8000/bvrfm" controls style="display:none"></audio>

или

<audio id="audio" src="http://free.radioheart.ru:8000/bvrfm" controls style="visibility:hidden"></audio>

Спасибо большое все работает)! Только проблема возникла, открыл его через другой браузер, а там музыка не играет((( Для меня это не страшно, а вот для слушателей будет не удобно

888
Falcon @Falcon
Не все браузеры поддерживают html5 audio тег, который вы используете

120
Александр @Aleksandr_Boyko
да вот прикол в том что, этот плеер не работает в браузере Uran Opera и Mozilla а вот плеер с таких сайтов как europaplus.ru работает отлично, во всех браузерах, там я насколько понимаю, тоже стоит html5

6245
Тарас @tarasian666
europaplus.ru работает отлично, во всех браузерах, там я насколько понимаю, тоже стоит html5

там flash
у каждого браузера разные форматы аудио поддерживаются, также зависит от их версии