Skip to content

Instantly share code, notes, and snippets.

@eliziebluiz

eliziebluiz/index.html

Created November 8, 2019 19:52
Show Gist options
  • Save eliziebluiz/ec2c8c4f7a81576d8a1778960ec184df to your computer and use it in GitHub Desktop.
Save eliziebluiz/ec2c8c4f7a81576d8a1778960ec184df to your computer and use it in GitHub Desktop.
Download ZIP
Rádio Multimidia // source https://jsbin.com/lukacuf
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<title>Rádio Multimidia</title>
<link rel="icon" href="1.png" type="imagem/gif">
<link rel="stylesheet" href="style.css"></link>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<style id="jsbin-css">
body{
background-image: url(12.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
background-size: 100% 100%;
}
p{
color: white;
}
b{
color: white;
}
h3{
color: white;
}
a{
text-decoration:none;
color: white;
}
ul{
list-style-type: none;
}
#cantores{
height: 130px;
width: 130px;
}
#audio{
height: 40px;
width: 1290px;
background-color:purple;
}
#playlist{
list-style: none;
text-align: center;
float: right;
}
#playlist1{
list-style: none;
text-align: center;
float: right;
}
#playlist2{
list-style: none;
text-align: center;
float: right;
}
#playlist3{
list-style: none;
text-align: center;
float: right;
}
#playlist4{
list-style: none;
text-align: center;
float: right;
}
#playlist5{
list-style: none;
text-align: center;
float: right;
}
.slider-wrapper input {
width: 150px;
height: 20px;
margin: 10;
transform-origin: 75px 75px;
}
h4{
color:white;
}
canvas{
width:401px;
height:150px;
}
</style>
</head>
<body>
<ul id="playlist1">
<li><a href="felipe.mp3">
<img id="cantores" src="unnamed.jpg">
<h4>Sessão do Descarrego</h4>
</a></li>
<li><a href="don.mp3">
<img id="cantores" src="don.jpg">
<h4>Na maciota</h4>
</a></li>
<li><a href="jonas.mp3">
<img id="cantores" src="jonas.jpg">
<h4>Ta Faltando Eu</h4>
</a></li>
</ul>
<ul id="playlist2">
<li><a href="matue.mp3">
<img id="cantores" src="matue.jpg">
<h4>Kenny g</h4>
</a></li>
<li><a href="xand.mp3">
<img id="cantores" src="xand.jpg">
<h4>Como é que faz</h4>
</a></li>
<li><a href="alo2.mp3">
<img id="cantores" src="alok.jpg">
<h4>Hear me now</h4>
</a></li>
</ul>
<ul id="playlist3">
<li><a href="ze.mp3">
<img id="cantores" src="ze.png">
<h4>Se você se entregar</h4>
</a></li>
<li><a href="mash.mp3">
<img id="cantores" src="drop.jpg">
<h4>Marshmello</h4>
</a></li>
<li><a href="ferrugem.mp3">
<img id="cantores" src="ferrugem.jpg">
<h4>Sonho</h4>
</a></li>
</ul>
<ul id="playlist4">
<li><a href="misa.mp3">
<img id="cantores" src="misa.jpg">
<h4>Sem Roteiro</h4>
</a></li>
<li><a href="hungria.mp3">
<img id="cantores" src="hungria.jpg">
<h4>Beijo com Trap</h4>
</a></li>
<li><a href="Negrodrama.mp3">
<img id="cantores" src="negodrama.png">
<h4>Nego Drama</h4>
</a></li>
</ul>
<ul id="playlist5">
<li><a href="gd.mp3">
<img id="cantores" src="gd.jpg">
<h4>Festinha lá em casa</h4>
</a></li>
<li><a href="pixote.mp3">
<img id="cantores" src="pixote.jpg">
<h4>Saudade Arregaça</h4>
</a></li>
<li><a href="alok1.mp3">
<img id="cantores" src="fuego.jpg">
<h4>Fuego</h4>
</a></li>
</ul>
<h4>Onda</h4>
<canvas id="canvas"></canvas>
<h4>Frequência</h4>
<canvas id ="canvas2"></canvas>
<p>Volume:</p>
<div class="slider-wrapper">
<input id="volume" type="range" min="0" max="1" value="7" step="0.001"/>
</div>
<p>Balanço:</p>
<input id="balanco" type="range" min="-1" max="1" step="0.001" value="0"/>
<audio id="audio" controls="controls" autoplay>
<source src="felipe.mp3">
</source>
</audio>
<script type = "text/javascript" src ="index.js"></script>
<script id="jsbin-javascript">
inicio1();
inicio2();
inicio3();
inicio4();
inicio5();
var canvas;
var canvas2;
var canvasContext;
var canvasContext2;
var width;
var height;
var width2;
var height2;
var analyser;
var analyser2;
var bufferLength;
var dataArray;
var dataArray2;
window.onload = function(){
var context = AudioContext || webkitAudioContext;
var audioContext = new context();
var audio = document.querySelector("#audio");
audio.onplay=(e)=>{audioContext.resume();}
canvas = document.querySelector("#canvas");
canvasContext = canvas.getContext("2d");
canvas2 = document.querySelector("#canvas2");
canvasContext2 = canvas2.getContext("2d");
width = canvas.width;
height = canvas.height;
width2 = canvas2.width;
height2 = canvas2.height;
var volume = document.querySelector("#volume");
var balanco = document.querySelector("#balanco");
var media = audioContext.createMediaElementSource(audio);
var audioControle = audioContext.createGain();
var balancoControle = audioContext.createStereoPanner();
analyser = audioContext.createAnalyser();
analyser.fftSize = 1024;
bufferLength = analyser.frequencyBinCount;
dataArray = new Uint8Array(bufferLength);
analyser2 = audioContext.createAnalyser();
analyser2.fftSize = 1024;
bufferLength = analyser2.frequencyBinCount;
dataArray2 = new Uint8Array(bufferLength);
media.connect(audioControle);
audioControle.connect(analyser2);
analyser2.connect(analyser);
analyser.connect(balancoControle);
balancoControle.connect(audioContext.destination);
volume.oninput=function(e){
audioControle.gain.value=e.target.value;
}
balanco.oninput=function(e){
balancoControle.pan.value=e.target.value;
}
requestAnimationFrame(visualize);
requestAnimationFrame(visualize2);
}
function visualize(){
canvasContext.fillStyle = "black";
canvasContext.fillRect(0,0,width,height);
analyser.getByteTimeDomainData(dataArray);
canvasContext.lineWidth = 1;
canvasContext.strokeStyle = "purple"
canvasContext.beginPath();
var sliceWidth = width / bufferLength;
var x = 0;
for(var i = 0; i < bufferLength; i++){
var v = dataArray[i]/255;
var y = v * height;
if(i === 0){
canvasContext.moveTo(x,y);
}else{
canvasContext.lineTo(x,y);
}
x += sliceWidth;
}
canvasContext.stroke();
requestAnimationFrame(visualize);
;}
function visualize2(){
canvasContext2.fillStyle = "black";
var height2 = canvas2.height;
var width2 = canvas2.width;
canvasContext2.fillRect(0,0,width2,height2);
analyser2.getByteFrequencyData(dataArray2);
var x = 0;
var barWidth = width2 / bufferLength;
for(var i = 0; i < bufferLength; i++){
var v = dataArray2[i]/255;
var y = v * (height/2);
canvasContext2.fillStyle="purple";
canvasContext2.fillRect(x,height2/2,barWidth,-y);
canvasContext2.fillRect(x,height2/2,barWidth,y);
x+=barWidth + 2;
}
requestAnimationFrame(visualize2);
}
//Playlist1
function inicio1(){
var corrente = 0;
var audio = $("#audio");
var playlist = $("#playlist1");
var tracks= playlist.find("li a");
var len= tracks.length-1;
audio[0].play();
playlist.find("a").click(function(e){
e.preventDefault();
link = $(this);
corrente = link.parent().index();
exe(link, audio[0]);
});
audio[0].addEventListener("ended", function(e){
corrente++;
if(corrente == len){
corrente = 0;
link = playlist.find("a")[0];
}else{
link = playlist.find("a")[corrente];
}
exe($(link), audio[0]);
});
}
//Playlist2
function inicio2(){
var corrente = 0;
var audio = $("#audio");
var playlist = $("#playlist2");
var tracks= playlist.find("li a");
var len= tracks.length-1;
audio[0].play();
playlist.find("a").click(function(e){
e.preventDefault();
link = $(this);
corrente = link.parent().index();
exe(link, audio[0]);
});
audio[0].addEventListener("ended", function(e){
corrente++;
if(corrente == len){
corrente = 0;
link = playlist.find("a")[0];
}else{
link = playlist.find("a")[corrente];
}
exe($(link), audio[0]);
});
}
//Playlist3
function inicio3(){
var corrente = 0;
var audio = $("#audio");
var playlist = $("#playlist3");
var tracks= playlist.find("li a");
var len= tracks.length-1;
audio[0].play();
playlist.find("a").click(function(e){
e.preventDefault();
link = $(this);
corrente = link.parent().index();
exe(link, audio[0]);
});
audio[0].addEventListener("ended", function(e){
corrente++;
if(corrente == len){
corrente = 0;
link = playlist.find("a")[0];
}else{
link = playlist.find("a")[corrente];
}
exe($(link), audio[0]);
});
}
//Playlist4
function inicio4(){
var corrente = 0;
var audio = $("#audio");
var playlist = $("#playlist4");
var tracks= playlist.find("li a");
var len= tracks.length-1;
audio[0].play();
playlist.find("a").click(function(e){
e.preventDefault();
link = $(this);
corrente = link.parent().index();
exe(link, audio[0]);
});
audio[0].addEventListener("ended", function(e){
corrente++;
if(corrente == len){
corrente = 0;
link = playlist.find("a")[0];
}else{
link = playlist.find("a")[corrente];
}
exe($(link), audio[0]);
});
}
//Playlist5
function inicio5(){
var corrente = 0;
var audio = $("#audio");
var playlist = $("#playlist5");
var tracks= playlist.find("li a");
var len= tracks.length-1;
audio[0].play();
playlist.find("a").click(function(e){
e.preventDefault();
link = $(this);
corrente = link.parent().index();
exe(link, audio[0]);
});
audio[0].addEventListener("ended", function(e){
corrente++;
if(corrente == len){
corrente = 0;
link = playlist.find("a")[0];
}else{
link = playlist.find("a")[corrente];
}
exe($(link), audio[0]);
});
}
function exe(link, player){
player.src=link.attr("href");
par=link.parent();
par.addClass("active").siblings.removeClasss("active");
player.load();
player.play();
}
</script>
<script id="jsbin-source-css" type="text/css">body{
background-image: url(12.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
background-size: 100% 100%;
}
p{
color: white;
}
b{
color: white;
}
h3{
color: white;
}
a{
text-decoration:none;
color: white;
}
ul{
list-style-type: none;
}
#cantores{
height: 130px;
width: 130px;
}
#audio{
height: 40px;
width: 1290px;
background-color:purple;
}
#playlist{
list-style: none;
text-align: center;
float: right;
}
#playlist1{
list-style: none;
text-align: center;
float: right;
}
#playlist2{
list-style: none;
text-align: center;
float: right;
}
#playlist3{
list-style: none;
text-align: center;
float: right;
}
#playlist4{
list-style: none;
text-align: center;
float: right;
}
#playlist5{
list-style: none;
text-align: center;
float: right;
}
.slider-wrapper input {
width: 150px;
height: 20px;
margin: 10;
transform-origin: 75px 75px;
}
h4{
color:white;
}
canvas{
width:401px;
height:150px;
}
</script>
<script id="jsbin-source-javascript" type="text/javascript">inicio1();
inicio2();
inicio3();
inicio4();
inicio5();
var canvas;
var canvas2;
var canvasContext;
var canvasContext2;
var width;
var height;
var width2;
var height2;
var analyser;
var analyser2;
var bufferLength;
var dataArray;
var dataArray2;
window.onload = function(){
var context = AudioContext || webkitAudioContext;
var audioContext = new context();
var audio = document.querySelector("#audio");
audio.onplay=(e)=>{audioContext.resume();}
canvas = document.querySelector("#canvas");
canvasContext = canvas.getContext("2d");
canvas2 = document.querySelector("#canvas2");
canvasContext2 = canvas2.getContext("2d");
width = canvas.width;
height = canvas.height;
width2 = canvas2.width;
height2 = canvas2.height;
var volume = document.querySelector("#volume");
var balanco = document.querySelector("#balanco");
var media = audioContext.createMediaElementSource(audio);
var audioControle = audioContext.createGain();
var balancoControle = audioContext.createStereoPanner();
analyser = audioContext.createAnalyser();
analyser.fftSize = 1024;
bufferLength = analyser.frequencyBinCount;
dataArray = new Uint8Array(bufferLength);
analyser2 = audioContext.createAnalyser();
analyser2.fftSize = 1024;
bufferLength = analyser2.frequencyBinCount;
dataArray2 = new Uint8Array(bufferLength);
media.connect(audioControle);
audioControle.connect(analyser2);
analyser2.connect(analyser);
analyser.connect(balancoControle);
balancoControle.connect(audioContext.destination);
volume.oninput=function(e){
audioControle.gain.value=e.target.value;
}
balanco.oninput=function(e){
balancoControle.pan.value=e.target.value;
}
requestAnimationFrame(visualize);
requestAnimationFrame(visualize2);
}
function visualize(){
canvasContext.fillStyle = "black";
canvasContext.fillRect(0,0,width,height);
analyser.getByteTimeDomainData(dataArray);
canvasContext.lineWidth = 1;
canvasContext.strokeStyle = "purple"
canvasContext.beginPath();
var sliceWidth = width / bufferLength;
var x = 0;
for(var i = 0; i < bufferLength; i++){
var v = dataArray[i]/255;
var y = v * height;
if(i === 0){
canvasContext.moveTo(x,y);
}else{
canvasContext.lineTo(x,y);
}
x += sliceWidth;
}
canvasContext.stroke();
requestAnimationFrame(visualize);
;}
function visualize2(){
canvasContext2.fillStyle = "black";
var height2 = canvas2.height;
var width2 = canvas2.width;
canvasContext2.fillRect(0,0,width2,height2);
analyser2.getByteFrequencyData(dataArray2);
var x = 0;
var barWidth = width2 / bufferLength;
for(var i = 0; i < bufferLength; i++){
var v = dataArray2[i]/255;
var y = v * (height/2);
canvasContext2.fillStyle="purple";
canvasContext2.fillRect(x,height2/2,barWidth,-y);
canvasContext2.fillRect(x,height2/2,barWidth,y);
x+=barWidth + 2;
}
requestAnimationFrame(visualize2);
}
//Playlist1
function inicio1(){
var corrente = 0;
var audio = $("#audio");
var playlist = $("#playlist1");
var tracks= playlist.find("li a");
var len= tracks.length-1;
audio[0].play();
playlist.find("a").click(function(e){
e.preventDefault();
link = $(this);
corrente = link.parent().index();
exe(link, audio[0]);
});
audio[0].addEventListener("ended", function(e){
corrente++;
if(corrente == len){
corrente = 0;
link = playlist.find("a")[0];
}else{
link = playlist.find("a")[corrente];
}
exe($(link), audio[0]);
});
}
//Playlist2
function inicio2(){
var corrente = 0;
var audio = $("#audio");
var playlist = $("#playlist2");
var tracks= playlist.find("li a");
var len= tracks.length-1;
audio[0].play();
playlist.find("a").click(function(e){
e.preventDefault();
link = $(this);
corrente = link.parent().index();
exe(link, audio[0]);
});
audio[0].addEventListener("ended", function(e){
corrente++;
if(corrente == len){
corrente = 0;
link = playlist.find("a")[0];
}else{
link = playlist.find("a")[corrente];
}
exe($(link), audio[0]);
});
}
//Playlist3
function inicio3(){
var corrente = 0;
var audio = $("#audio");
var playlist = $("#playlist3");
var tracks= playlist.find("li a");
var len= tracks.length-1;
audio[0].play();
playlist.find("a").click(function(e){
e.preventDefault();
link = $(this);
corrente = link.parent().index();
exe(link, audio[0]);
});
audio[0].addEventListener("ended", function(e){
corrente++;
if(corrente == len){
corrente = 0;
link = playlist.find("a")[0];
}else{
link = playlist.find("a")[corrente];
}
exe($(link), audio[0]);
});
}
//Playlist4
function inicio4(){
var corrente = 0;
var audio = $("#audio");
var playlist = $("#playlist4");
var tracks= playlist.find("li a");
var len= tracks.length-1;
audio[0].play();
playlist.find("a").click(function(e){
e.preventDefault();
link = $(this);
corrente = link.parent().index();
exe(link, audio[0]);
});
audio[0].addEventListener("ended", function(e){
corrente++;
if(corrente == len){
corrente = 0;
link = playlist.find("a")[0];
}else{
link = playlist.find("a")[corrente];
}
exe($(link), audio[0]);
});
}
//Playlist5
function inicio5(){
var corrente = 0;
var audio = $("#audio");
var playlist = $("#playlist5");
var tracks= playlist.find("li a");
var len= tracks.length-1;
audio[0].play();
playlist.find("a").click(function(e){
e.preventDefault();
link = $(this);
corrente = link.parent().index();
exe(link, audio[0]);
});
audio[0].addEventListener("ended", function(e){
corrente++;
if(corrente == len){
corrente = 0;
link = playlist.find("a")[0];
}else{
link = playlist.find("a")[corrente];
}
exe($(link), audio[0]);
});
}
function exe(link, player){
player.src=link.attr("href");
par=link.parent();
par.addClass("active").siblings.removeClasss("active");
player.load();
player.play();
}
</script></body>
</html>
Raw
jsbin.lukacuf.css
body{
background-image: url(12.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
background-size: 100% 100%;
}
p{
color: white;
}
b{
color: white;
}
h3{
color: white;
}
a{
text-decoration:none;
color: white;
}
ul{
list-style-type: none;
}
#cantores{
height: 130px;
width: 130px;
}
#audio{
height: 40px;
width: 1290px;
background-color:purple;
}
#playlist{
list-style: none;
text-align: center;
float: right;
}
#playlist1{
list-style: none;
text-align: center;
float: right;
}
#playlist2{
list-style: none;
text-align: center;
float: right;
}
#playlist3{
list-style: none;
text-align: center;
float: right;
}
#playlist4{
list-style: none;
text-align: center;
float: right;
}
#playlist5{
list-style: none;
text-align: center;
float: right;
}
.slider-wrapper input {
width: 150px;
height: 20px;
margin: 10;
transform-origin: 75px 75px;
}
h4{
color:white;
}
canvas{
width:401px;
height:150px;
}
Raw
jsbin.lukacuf.js
inicio1();
inicio2();
inicio3();
inicio4();
inicio5();
var canvas;
var canvas2;
var canvasContext;
var canvasContext2;
var width;
var height;
var width2;
var height2;
var analyser;
var analyser2;
var bufferLength;
var dataArray;
var dataArray2;
window.onload = function(){
var context = AudioContext || webkitAudioContext;
var audioContext = new context();
var audio = document.querySelector("#audio");
audio.onplay=(e)=>{audioContext.resume();}
canvas = document.querySelector("#canvas");
canvasContext = canvas.getContext("2d");
canvas2 = document.querySelector("#canvas2");
canvasContext2 = canvas2.getContext("2d");
width = canvas.width;
height = canvas.height;
width2 = canvas2.width;
height2 = canvas2.height;
var volume = document.querySelector("#volume");
var balanco = document.querySelector("#balanco");
var media = audioContext.createMediaElementSource(audio);
var audioControle = audioContext.createGain();
var balancoControle = audioContext.createStereoPanner();
analyser = audioContext.createAnalyser();
analyser.fftSize = 1024;
bufferLength = analyser.frequencyBinCount;
dataArray = new Uint8Array(bufferLength);
analyser2 = audioContext.createAnalyser();
analyser2.fftSize = 1024;
bufferLength = analyser2.frequencyBinCount;
dataArray2 = new Uint8Array(bufferLength);
media.connect(audioControle);
audioControle.connect(analyser2);
analyser2.connect(analyser);
analyser.connect(balancoControle);
balancoControle.connect(audioContext.destination);
volume.oninput=function(e){
audioControle.gain.value=e.target.value;
}
balanco.oninput=function(e){
balancoControle.pan.value=e.target.value;
}
requestAnimationFrame(visualize);
requestAnimationFrame(visualize2);
}
function visualize(){
canvasContext.fillStyle = "black";
canvasContext.fillRect(0,0,width,height);
analyser.getByteTimeDomainData(dataArray);
canvasContext.lineWidth = 1;
canvasContext.strokeStyle = "purple"
canvasContext.beginPath();
var sliceWidth = width / bufferLength;
var x = 0;
for(var i = 0; i < bufferLength; i++){
var v = dataArray[i]/255;
var y = v * height;
if(i === 0){
canvasContext.moveTo(x,y);
}else{
canvasContext.lineTo(x,y);
}
x += sliceWidth;
}
canvasContext.stroke();
requestAnimationFrame(visualize);
;}
function visualize2(){
canvasContext2.fillStyle = "black";
var height2 = canvas2.height;
var width2 = canvas2.width;
canvasContext2.fillRect(0,0,width2,height2);
analyser2.getByteFrequencyData(dataArray2);
var x = 0;
var barWidth = width2 / bufferLength;
for(var i = 0; i < bufferLength; i++){
var v = dataArray2[i]/255;
var y = v * (height/2);
canvasContext2.fillStyle="purple";
canvasContext2.fillRect(x,height2/2,barWidth,-y);
canvasContext2.fillRect(x,height2/2,barWidth,y);
x+=barWidth + 2;
}
requestAnimationFrame(visualize2);
}
//Playlist1
function inicio1(){
var corrente = 0;
var audio = $("#audio");
var playlist = $("#playlist1");
var tracks= playlist.find("li a");
var len= tracks.length-1;
audio[0].play();
playlist.find("a").click(function(e){
e.preventDefault();
link = $(this);
corrente = link.parent().index();
exe(link, audio[0]);
});
audio[0].addEventListener("ended", function(e){
corrente++;
if(corrente == len){
corrente = 0;
link = playlist.find("a")[0];
}else{
link = playlist.find("a")[corrente];
}
exe($(link), audio[0]);
});
}
//Playlist2
function inicio2(){
var corrente = 0;
var audio = $("#audio");
var playlist = $("#playlist2");
var tracks= playlist.find("li a");
var len= tracks.length-1;
audio[0].play();
playlist.find("a").click(function(e){
e.preventDefault();
link = $(this);
corrente = link.parent().index();
exe(link, audio[0]);
});
audio[0].addEventListener("ended", function(e){
corrente++;
if(corrente == len){
corrente = 0;
link = playlist.find("a")[0];
}else{
link = playlist.find("a")[corrente];
}
exe($(link), audio[0]);
});
}
//Playlist3
function inicio3(){
var corrente = 0;
var audio = $("#audio");
var playlist = $("#playlist3");
var tracks= playlist.find("li a");
var len= tracks.length-1;
audio[0].play();
playlist.find("a").click(function(e){
e.preventDefault();
link = $(this);
corrente = link.parent().index();
exe(link, audio[0]);
});
audio[0].addEventListener("ended", function(e){
corrente++;
if(corrente == len){
corrente = 0;
link = playlist.find("a")[0];
}else{
link = playlist.find("a")[corrente];
}
exe($(link), audio[0]);
});
}
//Playlist4
function inicio4(){
var corrente = 0;
var audio = $("#audio");
var playlist = $("#playlist4");
var tracks= playlist.find("li a");
var len= tracks.length-1;
audio[0].play();
playlist.find("a").click(function(e){
e.preventDefault();
link = $(this);
corrente = link.parent().index();
exe(link, audio[0]);
});
audio[0].addEventListener("ended", function(e){
corrente++;
if(corrente == len){
corrente = 0;
link = playlist.find("a")[0];
}else{
link = playlist.find("a")[corrente];
}
exe($(link), audio[0]);
});
}
//Playlist5
function inicio5(){
var corrente = 0;
var audio = $("#audio");
var playlist = $("#playlist5");
var tracks= playlist.find("li a");
var len= tracks.length-1;
audio[0].play();
playlist.find("a").click(function(e){
e.preventDefault();
link = $(this);
corrente = link.parent().index();
exe(link, audio[0]);
});
audio[0].addEventListener("ended", function(e){
corrente++;
if(corrente == len){
corrente = 0;
link = playlist.find("a")[0];
}else{
link = playlist.find("a")[corrente];
}
exe($(link), audio[0]);
});
}
function exe(link, player){
player.src=link.attr("href");
par=link.parent();
par.addClass("active").siblings.removeClasss("active");
player.load();
player.play();
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment