H50081:背景音乐按钮创建 html元素上禁止拖拽

1,

    <!-- 音乐按钮 -->
    <div class="bgmusic generalF"></div>
    <!-- 音乐模块 -->
    <audio id="myAudio" hidden="true" autoplay="autoplay" loop="loop" preload="auto" controls="controls" src="home/res/bg.mp3"></audio>

 

2,

.bgmusic {
    z-index: 2;
    width: 5vh;
    height: 5vh;
    bottom: 2vh;
    left: calc(2vh);
    background-image: url("../images/musN.png");
    /* background-color: green; */
}
.bgmusic.active {
    background-image: url("../images/musA.png");
}

 

3,

        // 创建音频
        // var aud1 = document.createElement("audio");
        // aud1.id = "myAudio", 
        // aud1.src = "page/res/audio.mp3", 
        // aud1.controls = "controls",
        // aud1.autoplay = "autoplay",
        // aud1.loop = "loop",
        // aud1.style.display = "none",
        // document.body.appendChild(aud1);



        // // 背景音乐模块
        // $(".modMus").on("click", function (e) {
        //     if ($first(".modMus").classList.contains("active")) {
        //         $first(".modMus").classList.remove("active");
        //         document.getElementById("myAudio").pause();
        //     } else {
        //         $first(".modMus").classList.add("active");
        //         document.getElementById("myAudio").play();
        //     }
        // });

 

 

<div class="leftButton" id="leftBtn" ondragstart="return!1" oncontextmenu="return!1" onselectstart="return!1">

 

 

posted @ 2022-03-11 12:24  琥珀君  阅读(70)  评论(0)    收藏  举报