jquery 音乐添加

最新推荐文章于 2022-08-16 16:27:29 发布

九

最新推荐文章于 2022-08-16 16:27:29 发布

阅读量2.5k

点赞数

分类专栏： jquery html5 css js 文章标签：音乐 html5 css3 jquery

本文链接：https://blog.csdn.net/qq_31301099/article/details/50343923

版权

js 同时被 3 个专栏收录

33 篇文章 0 订阅

订阅专栏

html5

28 篇文章 0 订阅

订阅专栏

css

20 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<script src="jquery-1.3.2.min.js"></script>

<body>
<!--控制播放-->

<div id="bg_music_btn" num='1' style="background-color: black;height: 100px;width: 100px;">关闭背景音乐</div>

<!--背景音乐-->

<div id="bg_music"></div>

<script>
 //    添加音乐*************************************************************************************************
$(document).ready(function () {
    $('#bg_music').append('<audio id="m_bg_music" loop="loop" preload="auto" autoplay="autoplay" src="1.mp3" />');
    var mp3=$('#m_bg_music')[0];

    $('#bg_music_btn').click(function(){
        var num = $('#bg_music_btn').attr('num');
        if(num == "1")
        {
            $('#bg_music_btn').attr('num','0');
            mp3.pause();
        }
        if(num == "0")
        {
            $('#bg_music_btn').attr('num','1');
            mp3.play();
        }
    });
});
</script></body></html>

想测试的话复制粘贴即可  再加入相关的资源即可   注意修改文件路径与资源

九

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
jquery 音乐添加

html>html lang="en">head> meta charset="UTF-8"> title>title>head>script src="jquery-1.3.2.min.js">script>body>div id="bg_music_btn" state='1' style="background-color: black;height: 10
复制链接

扫一扫

专栏目录