Gatget MP3 Player 1

February 16, 2020
KALIAN TINGGAL PASANG DAN GANTI LINK LAGUNYA

CODE HTML, CSS & JS

HTML
<div id="app">
  <div>
    <button @click="selected = 'https://sites.google.com/site/dzakynetmusik/audio/AKUSTIK%20TEBILIN%20BESIDANG%20-%20MP3'">besidang mp3</button>
    <button @click="selected = 'https://iplanning.heteml.net/intern/music-player/bgm02.mp3'">BAU KENYAMEN mp3</button>
    <button @click="selected = 'https://sites.google.com/site/dzakynetmusik/audio/BAU%20KENYAMEN'">B.KENYAMEN mp3</button>
 <button @click="selected = 'https://sites.google.com/site/dzakynetmusik/audio/BERINAQ%20TEREQ'">b.tereq mp3</button>
     <button @click="selected = 'https://sites.google.com/site/dzakynetmusik/audio/BURUNG%20DOANG%20VERSI%20AKUSTIK%20Mp3'">b.doang mp3</button>
     <button @click="selected = 'https://sites.google.com/site/dzakynetmusik/audio/LAGU%20RUDAT%201'">L.rudat mp3</button>
    <button @click="selected = 'https://sites.google.com/site/dzakynetmusik/audio/SELINGKUH%20TKTK%2005'">selingkuh mp3</button>  <button @click="selected = 'https://sites.google.com/site/dzakynetmusik/audio/SUBAHNALE'">subahnale mp3</button>
  <button @click="selected = 'https://sites.google.com/site/dzakynetmusik/audio/Temu%20karya%2005%20Bekembang%20angen%20terbaru%20di%20lilir%20gunung%20sari.mp3'">g.sari mp3</button> 
  </div>
  <div>
    <audio :src="selected" controls autoplay />
  </div>

</div>

CSS;
#app {
  text-align: center;
  padding: 2rem;
  margin: 0 auto;
  border: 10px solid #333;
  border-radius: 1em;
  width: 20rem;
}
button {
  padding: 1rem;
  margin: 0.5rem;
}

JAVASCRIPT;
Vue.config.devtools = true;

new Vue({
  el: "#app",
  data: {
    selected: ""
  }
});

Share this

Related Posts

Previous
Next Post »