使用超棒的字体播放音频网址

问题描述 投票:-4回答:1

我需要一些帮助来使我的按钮在播放音乐时可以播放音乐,而不会弹出到另一个页面。

我正在使用此代码

<head>
  <title>Font Awesome Icons</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>

<body>
  <center>
    <a href="http://radio.melodiapatras.gr/listen/melodia.htm" target="_blank" rel="noopener">
      <i class="fa fa-play-circle" style="font-size:150px;color:#1676cf"></i>
    </a>
  </center>
</body>
html button
1个回答
0
投票

您将需要使用javascript。请运行并检查所需功能的代码段。

button {
  background: transparent;
  border: none;
}

button:focus {
  outline: none;
}
<head>
  <title>Font Awesome Icons</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>

<body>
  <center>
    <button onclick=playMelodia()>
      <i class="fa fa-play-circle" style="font-size:150px;color:#1676cf"></i>
    </button>
    <audio id="melodia" controls="" style="display: none"><source src="http://i.streams.ovh:9523/stream.mp3" type="audio/mp3">Your browser does not support the audio element.</audio>

  </center>
  <script>
    function playMelodia() {
      document.getElementById("melodia").play();
    }
  </script>
</body>
© www.soinside.com 2019 - 2024. All rights reserved.