将 MP3 添加到 jquery 以获取背景音乐

Posted 2023-02-25

【中文标题】将 MP3 添加到 jquery 以获取背景音乐

【英文标题】：Adding MP3 to jquery for background music

【发布时间】：2017-02-18 01:50:26

【问题描述】：

我的jquery滑块的基本结构如下： html：

<div id="slideshow">
    <img src="img1.jpg" style="position:absolute;" class="active" />
    <img src="img2.jpg" style="position:absolute;" />
    <img src="img3.jpg" style="position:absolute;" />
</div>

CSS：

<style type="text/css">
    .active
        z-index:99;
    
</style>

jquery：

<script type="text/javascript" charset="utf-8">
  $(window).load(function() 
    $('.flexslider').flexslider();
  );
</script>

现在，我想添加一个 MP3 文件来播放背景音乐，它应该具有以下属性：加载时自动播放 = 是，循环 = 是，音量 = 50

我应该使用什么代码以及它应该放在哪里？ （不想显示控件）

谢谢。

【参考方案1】：

你可以这样试试，

<audio autoplay preload='auto' loop id="myAudio">
  <source src="song name with extension" type="audio/mpeg" >
</audio>

音量：

var aud = document.getElementById("myAudio");
aud.volume = 0.5; // default 1 means 100%

preload -> 作者认为页面加载时浏览器应该加载整个音频文件

注意：对于移动设备，您必须提供点击事件才能加载音频/视频。

请记住，您应该在歌曲名称处提供绝对路径或保留该文件

一次尝试。

它应该可以工作。

【讨论】：

成功了！谢谢。 :) “绝对路径”是指那个 mp3 的网址吗？

这表示来自根文件夹的路径。检查link

或将该 mp3 文件保存在当前文件所在的同一文件夹中

嗯，我明白了。我将一个 mp3 文件上传到我的 Google 驱动器以获取它的绝对路径，但 URL 没有提供 .mp3 扩展名。检查：drive.google.com/open?id=0Bwx2dCRPVvabQlVUUmlxVFRUUnM出了什么问题？

哦，让我给你示例 url here。我担心的是，如果您在实时站点上执行此操作，请将示例 mp3 文件存储在基本路径中，并将该文件路径提供给您的源 src