Problema con ejemplo que quiero en una web, alguien que sepa ??

No estoy segura cuánto en realidad te servirá este plugin pero tal vez te ponga en el camino correcto:

https://wordpress.org/plugins/html5-jquery-audio-player/

No lo he usado personalmente, pero despues de ver el código de la página que acabas de mandar,ví que usan /jquery_jplayer_1

No sé si es posible ponerlo al final como tú gustas, pero probablemete el plugin junto con esto: http://www.codebasehero.com/2011/06/html-music-player/ te puede ayudar.

¡Buenos días, neomatrixxxx! Bueno, al menos aquí es dias 🙂

Por lo que yo sé, agregar la funcionalidad que buscas no se limita a solo agregar un código a la página ya que el uso de audio siempre ha sido un problema debido a la variedad de navegadores de Internet y las jaquecas que nos dan sus compatibilidades.

Este artículo te presenta algunos de los problemas de usar unas cuantas líneas para agregar sonidos a tu página web.
http://www.w3schools.com/html/html_sounds.asp

Al menos de que optes por usar solo un plugin como el que te presenté, agregar la barra como gustas requerirá más detalle del que esperas.

Este es una versión de un reproductor de música usando JavaScript: http://wpaudioplayer.com/standalone/

Parte del código que se usa en la página de ejemplo de lo que buscas es el siguiente, y como puedes ver, el dolor de cabeza con el código continúa. Mi recomendación sería empezar con el plugin si necesitas el audio inmediatamente y después ya sea tomarte el tiempo de construir el reproductor de música que buscas o contratar a alguién que lo haga por ti.

<script type="text/javascript">
jQuery(document).ready(function($){
$.backstretch("http://redenciongualan.com/rg/wp-content/uploads/2013/10/Abstract-Hdtv.jpg");
$("#jquery_jplayer_1").jPlayer({
ready: function () {
$(this).jPlayer("setMedia", {
mp3: "http://184.154.43.106:8103/;stream/1"
}).jPlayer("play");
debug($(this));
},
swfPath: "http://redenciongualan.com/rg/wp-content/themes/soundwave/swf/",
supplied: "mp3",
volume: 1
});
$(".radio-wz-open-hidden").click(function () {
$("#radio-wz #radio-wz-col").slideToggle({
direction: "up"
}, 100);
$(this).toggleClass("clientsClose");
});
$("#radio-wz-col").show();
function mouseHandler(e){
if ($(this).hasClass("radio-wz-hidden-open")) {
$(this).removeClass("radio-wz-hidden-open");
} else {
$(".radio-wz-hidden-open").removeClass("radio-wz-hidden-open");
$(this).addClass("radio-wz-hidden-open");
}
}
function start(){
$(".radio-wz-open-hidden").bind("click", mouseHandler);
}
$(document).ready(start);
if ( jQuery(".flexslider").length && jQuery() ) {
jQuery(".flexslider").flexslider({
controlNav: true,
animationLoop: true,
controlsContainer:"",
pauseOnAction: false,
pauseOnHover: true,
smoothHeight: true,
nextText:"&rsaquo;",
prevText:"&lsaquo;",
keyboardNav: false,
slideshowSpeed: 3000,
animationSpeed: 500,
start: function(slider) {
slider.removeClass("loading");
}
});
}
});
</script>

Honestamente, espero que alguien más se una a la conversación con una mejor opción porque a mí también me gustaría tener esta opción en mi página pero no la he usado porque la única forma que conozco para hacerlo implica quebrarme la cabeza con todo eso 🙁