最新时时彩平台演示 中新时时彩要不要交税 新时时彩三星组六技巧 最新时时彩源码修改 新时时彩遗漏走势图 新时时彩预测方法 新时时彩计算器 新时时彩开奖皇冠网址 新时时彩组三怎么玩 最新时时彩后四稳赚 新时时彩官方开奖网站 新时时彩人工计划 新时时彩开奖漏洞 新时时彩最长遗漏 新时时彩中奖顺序 360新时时彩技巧-轴承资讯 新时时彩停售 最新时时彩杀号高手 新时时彩三星走势图 玩新时时彩有什么技巧 新时时彩3星和尾走势 新时时彩后一公式 重新时时彩网站 新时时彩遗漏统计软件 吉林新时时彩走势图 新时时彩中奖怎么查 新时时彩是什么地方 新时时彩中奖怎么查 新时时彩下载手机版下载 新时时彩贴吧 最新时时彩计划软件 大赢家新时时彩 新时时彩注册送彩金 新时时彩组选投注技巧 新时时彩走势图 新时时彩万能5码 新时时彩模拟 新疆新时时彩往期开奖号码 新时时彩的玩法 新时时彩稳赚计划 最新时时彩70注 新时时彩返奖率 新时时彩杀号定胆360 新时时彩后二杀号 新时时彩振幅走势 最新时时彩教程 新时时彩后台软件 新时时彩几点开始 新时时彩日赚几百 最新时时彩注册送20
用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,登录网站

2

主题

17

帖子

299

积分

架构狮

Rank: 3Rank: 3

积分
299
2018-11-15 19:39:35 w王海洋29 架构狮 楼主 61788
本帖最后由 w王海洋29 于 2018-11-15 20:03 编辑

小程序背景音乐


给自己的小程序加上一个背景音乐是一个很有趣的事情呢,可以在使用小程序的时候点开歌曲,
专属的情歌更棒哦。所以今天介绍一个简单的方法给自己的小程序加上一首歌曲。不足之处多多指教。

小程序大学签到使用了背景音乐的功能,欢迎体验,同时欢迎公众号关联,本人微信:1771737622


背景音乐的js文件

[JavaScript] 纯文本查看 复制代码
// 背景音乐
const innerAudioContext = wx.createInnerAudioContext()
Page({
  /**
   * 页面的初始数据
   */
  data: {
    mp3: 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E061FF02C31F716658E5C81F5594D561F2E88B854E81CAAB7806D5E4F103E55D33C16F3FAC506D1AB172DE8600B37E43FAD&fromtag=46',
    // 背景音乐
    bgm: false,
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (e) {
  },
  // 背景音乐
  BGM: function (e) {
    let that = this;
    if (that.data.bgm) {
      that.setData({
        bgm: false,
      })
      innerAudioContext.pause(); /**  暂停音乐 */
    } else {
      that.setData({
        bgm: true,
        bgmImgAni: "bgmImgAni"
      })
      // 播放音乐
      innerAudioContext.autoplay = true
      innerAudioContext.loop = true
      innerAudioContext.src = that.data.mp3;
      innerAudioContext.play()
    }
  },
})




背景音乐的wxml文件

[HTML] 纯文本查看 复制代码
<!--index.wxml-->
<!--   背景音乐  -->
<view class='bgmView' catchtap='BGM'>
  <image wx:if='{{bgm}}' class='bgmImg {{bgmImgAni}}' src='/images/kaishi.png'></image>
  <image wx:else class='bgmImg' src='/images/zanting.png'></image>
</view>



背景音乐的wxss文件

[CSS] 纯文本查看 复制代码
/**index.wxss**/
/* 背景音乐  */
.bgmView {
  position: fixed;
  top: 20rpx;
  right: 20rpx;
  z-index: 99;
}

.bgmImg {
  width: 70rpx;
  height: 70rpx;
}

.bgmImgAni {
  animation: jumpball 4s infinite linear;
}

@keyframes jumpball {
  100% {
    transform: rotate(360deg);
  }
}


这就是基本的代码结构了



欢迎体验背景音乐功能






Bgmusic.zip

44.79 KB, 下载?#38382;? 69

14

分享至 : QQ空间
3 人收藏
听不错的~?#36824;?#26377;个问题,如何设置默认音乐自动开启?
本帖最后由 jay5211314 于 2018-11-28 14:48 编辑

请问歌曲链接怎么生成的呢?--查到了。。
jay5211314 发表于 2018-11-28 14:14
请问歌曲链接怎么生成的呢?--查到了。。

你把歌曲存到自己的数据库,就生?#31579;?#26354;链接了,或者引用其他的音乐链接就行了
文档里没看到loop啊,这?#24039;?/td>
w小千秋 发表于 2018-11-30 11:37
文档里没看到loop啊,这?#24039;?/blockquote>

什么loop?可以直接加我wx:1771737622,直接问吧,我没有理解
2018-12-23 18:08:35 w王海洋29 架构狮
7#
fhs1986 发表于 2018-12-16 17:18
听不错的~?#36824;?#26377;个问题,如何设置默认音乐自动开启?

直接在代码里面调一下状态就行了
发新帖
您需要登录后才可以回帖 登录 | 立即注册
新时时彩软件