Metz / Metz

Ca fait mal, c’est ça qui est bon… Excessif, révolté, punk et hard-core. Service minimum au niveau des accords, potentiomètres à fond, images no future. On aime tout ça.

<!DOCTYPE html> 
<html>
<head>
  <title>Lecteur Shoutcast</title>
  <style>
    /* Positionnement du lecteur en position header fixe */
    #player {
      position: fixed;
      top: 50;
      left: 0;
      width: 100%;
    }
  </style>
</head>
<body>
  <div id="player">
    <audio id="stream" src="http://82.66.229.232:8000/;stream.mp3" controls>
      Votre navigateur ne supporte pas l'élément audio.
    </audio>

    <div id="song-info">
      <p id="artist"></p>
      <p id="album"></p>
      <p id="year"></p>
    </div>

    <button id="volume-up" onclick="changeVolume(0.1)">+</button>
    <button id="volume-down" onclick="changeVolume(-0.1)">-</button>
  </div>

  <script>
    var stream = document.getElementById("stream");
    var artist = document.getElementById("artist");
    var album = document.getElementById("album");
    var year = document.getElementById("year");

    function changeVolume(amount) {
      var currentVolume = stream.volume;
      stream.volume = currentVolume + amount;
    }

  
  </script>
</body>
</html>

Metz / Metz

Faster

Archives