js网页点击播放背景音乐，再次点击暂停播放背景音乐
萌新正在学习前端js 尝试用js
效果：
点击艾欧尼亚昂扬不灭时 播放音乐，再次点击暂停播放
原理：
1、给这个div中添加 audio属性 js控制当点击这个div时播放 再次点击暂停
html中代码：
<div class="title-text"><img src="./img/艾欧尼亚图标.jfif" alt=""><span onclick="bgaudio()">艾欧尼亚—昂扬不灭!</span><audio src="../sungang/mp3/CRAT - 英雄联盟-Legend Never Die（CRAT remix）.mp3" id="bgaudio"></audio></div>
js中代码：
var bgaudiocount = 0;function bgaudio(){ ++bgaudiocount;if(bgaudiocount % 2 == 1){ document.getElementById("bgaudio").play(); }else{document.getElementById("bgaudio").pause();}}
设置一个计数器 当点击时，值为奇数时播放 ， 偶数暂停
前端萌新一个 如果你有更好的idear 欢迎在评论区指教~ 感谢~~~~（现在只学到js 或许以后我回头看到自己写的代码，回来一句就这? 23333~~~~）
js网页点击播放背景音乐，再次点击暂停播放背景音乐相关推荐
- 点击编辑框全选内容java_Android 中使用EditText 点击全选再次点击取消全选功能
最近在开发浏览器碰到这么一个需求:点击地址栏的时候,需要全选并调出键盘,再次点击就取消全选显示光标.点击屏幕除地址栏其他位置时,键盘隐藏,隐藏光标. 大部分浏览器都是这样的逻辑,这样可以提高用户体验, ...
- nw.js 打开一个exe项目，再次点击快捷方式启动已经存在的exe到最前端 open file with existing app
技术点:single-instance 和 gui.App.on('open',function({})) open监听事件 想要像c++可以实现打开一个实例后,再次点击exe文件时,不再创建新的实 ...
- js控制audio音量_js控制html5 audio音频暂停播放
js控制html5 audio音频暂停播放 音乐控制 音乐 播放/暂停 重新播放 function rbf(){ var audio = document.getElementById('music1 ...
- radio点击选中，再次点击取消选中
<!DOCTYPE HTML> <html> <head><title>单选按钮取消选中的三种方式</title><script ty ...
- ImageButton点击替换背景再次点击显示默认图片
实现方式:1.selector 2.isIconChange 第一种相信大家都会用,今天我主要说一下第二种 首先:private boolean isIconChange=true: priva ...
- vue3.0动态循环icon点击变色，再次点击取消选中
先看效果图 点击后发生改变 开始上代码 html部分 <div class="left-circle"><div class="whole-circle ...
- jquery点击加class再次点击移除添加的class
toggleClass方法可以实现对某一class进行添加.删除操作. 示例: html: <li class="li2 "><a href="java ...
- 【Android】点击按钮播放音乐，再次点击停止播放
1.在res下新建raw文件夹 将音频复制粘贴至文件夹 2.代码 (1)PlatformActivity.java public static int cnt = 0;SoundPool sp;//声 ...
- Unity 基础 之 在 UGUI 上简单实现VideoPlayer视频播放的功能，简单暂停播放/显示视频名称/显示时长/拖拽播放等
Unity 基础 之 在 UGUI 上简单实现VideoPlayer视频播放的功能,简单暂停播放/显示视频名称/显示时长/拖拽播放等 目录 Unity 基础 之 在 UGUI 上简单实现VideoPl ...
最新文章
- SpringBoot 概念和起步
- 网站推广——专业网站推广浅析企业网站排名有哪些影响因素？
- Tkinter的Scrollba组件
- 关于华为鸿蒙的三个核心问题
- 关于最近打的几题斜率优化的总结。加几AC代码。
- jggrid标红列和动态标红行的几种方法
- IDEA：IDEA采取debug的时候卡死-不报错
- rqnoj 愚蠢的矿工
- yolov3前向传播（三）-- 坐标转换,iou计算,权重加载,图片显示
- Javascript第六章计时器练习【源码】第四课
- iis7 运行多个https,433端口监听多个htps 站点
- vue 直接输入路由地址进入_vue地址栏直接输入路由无效问题的解决
- Java开发短连接分享功能
- 利用高斯（Guass）算法求解2维的SVP向量
- 什么是长连接？长连接、短连接、三次握手
- 发那科机器人网段_FANUC机器人以太网通讯手册
- Android适配--dimen
- JSP简介－什么是Java Server Pages?
- 和腾讯面试官聊了一个小时人生后，我竟意外的收到Java的offer
- yeelight智能设备+HomeKit+智汀家庭云，从零开始打造全屋智能