Question

您好，我只是想请一些帮助，我打算创建一个网站，我可以像在线广播一样直播。例如，像这个页面https://www.hospitalrecords.com/，即使您浏览整个网站，底部的玩家也不会停止。这是javascript吗？还是iframe？提前谢谢

亚瑟

Answer 1

您必须按照

修复页脚

    In CSS:
    .Footer{
        background-color:black;
        height:50px;
        color: white;
        position: fixed;
        width:100%;
    }

然后在页脚上添加音频标签... 在html5（记事本）中：

<body>
    <footer class="Footer">
    <!-- here you can add different audio plugin... but I am using html5 audio for example.. -->
    <audio control auto play loop>// it will loop through the music file
    <source src ="alam.mp3" type="audio/mpeg"/>
    <source src ="alam1.mp3" type="audio/mpeg"/>
    </audio>
    </footer>
    </body>

希望它合适......

Answer 2

我对Iframe并不熟悉，但可以使用JavaScript完成。一般的想法是定义作为主div更改的主体，并在单击选项卡时更改该div的内容。我很确定有更优雅的方式，但你可以使用所以你将使用lib。 JS称为Jquery，我不知道你是否熟悉它。您的页面实际上将包含一个Html文档，并且将具有一般布局（查看您发送的示例页面）

 <html>
  <body>

    <div class="jumbotron"> // This will be div, with a background img
     <ul class="nav"> // This will be you nav bar
        <li id="1"> </li>
        <li id="2>  </li>
     </ul> // For the sake of simplicity I just have 2 tabs 
    </div>
    <div id="mainbody"> ..bunch of initial html</div>
    <div class="footer"> </div> this is the music player
  </body>
</html>

对于Jquery中的每个标签：

  $(document).ready(function(){
    $("#1").click(function(){
           $("#main").html(...."the html of the body you want"...)
    }

$("#2").click(function(){
       $("#main").html(...."the html of the body you want"...)
}
})

由于我猜你的html会变得复杂，你可以使用.load（）而不是.html（）在这里阅读更多相关信息 http://api.jquery.com/html/ http://api.jquery.com/load/

如何让音乐播放器在网站上持续播放

2 个答案: