兼容ios与andriod的移动端音频自动播放音乐效果代码-html代码-BFW代码库

兼容ios与andriod的移动端音频自动播放音乐效果代码

代码语言：html

所属分类：多媒体

代码描述：兼容ios与andriod的移动端音频自动播放音乐效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0,minimum-scale=1.0,user-scalable=0" />
<style>
    * {
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
    }

    html,
    body {
        width: 100%;
        margin: 0 auto;
        height: 100%;
    }

    body {
        padding: 25px 25px;
    }

    .audio {
        display: none
    }

    .buttons {
        margin: 15px 0;
    }

    .buttons>div {

        min-width: 60px;
        width: auto!important;
        height: 45px;
        line-height: 45px;
        margin-bottom: 10px;
        color: #fff;
        text-align: center;
        padding: 0 8px;
        border-radius: 5px;
    }

    .buttons>div:nth-child(1) {
        background: #ace;
    }

    .buttons>div:nth-child(2) {
        background: #ff0000;
    }

    .buttons>div:nth-child(3) {
        background: #4CAF50;
    }

    .buttons>div:nth-child(4) {
        background: #008CBA;
    }

    .buttons>div:nth-child(5) {
        background: #555555;
    }

    .buttons>div:nth-child(6) {
        background: #e7e7e7;
    }
</style>
 <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script>
    <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>

</head>

<body>
	<h3>【good】音频自动播放总结(兼容微信苹果iphone)</h3>
    <div id="audioDiv">
        <audio id="audio" controls="controls" autoplay="autoplay">
            <source src="" type="audio/mpeg"/>
            设置不支持音频文件
        </audio>
    </div>
    <div class="buttons">
        <div class="btn play">播放</div>
        <div class="btn pause">暂停</div>
        <div class="btn stop">停止</div>
        <div class="btn skip&q.........完整代码请登录后点击上方下载按钮下载查看