前言
我们制作网站或者HTML单页的时候,没有播放音乐又觉得有些单调,自动播放音乐对于一些不喜欢的用户又觉得太吵,所以我们在网站或者HTML单页面上如果编写出一个弹窗提示用户是否开启音乐,那么喜欢边听歌边阅读网页内容的用户可以点击开启音乐,不喜欢的用户可以点击关闭音乐,这样可以很好的兼顾用户们的喜好。那么如何实现呢?话不多说下面就分享教程给大家!
教程
1.首先我们需要创建和调用2个主要的js文件。 若你的网站已经调用jquery,那么不需要添加下面的代码,若没有请添加下面的代码即可。
在目录下创建一个js文件把下面的音乐播放的主要js代码添加进去,然后调用这个js文件即可。
2、在网页的“</head>”之前添加下面的代码:
注:自己可以把自己喜欢的一首音乐上传到主机的某个目录下,然后添加音乐路径(例如:/Music/xxx.mp3,若无法播放,请把音乐名改为英文名)。
3、(本步骤也可以不添加)可以在网页的合适位置添加一个音乐开关按钮,代码如下:
音乐设置按钮代码:
音乐设置按钮CSS:
注:这是复制本站的一个按钮CSS代码,请自己定义按钮代码
4、在网页合适的地方添加弹窗提示是否开启音乐javascript代码(当然也可以创建js文件,然后调用):
效果
![图片[1]-为网页添加提示音乐播放弹窗](https://cdn.jsdelivr.net/gh/1701892167huan/qin@a04add802144cf20df79bf61920736d8ed4b075a/2021/12/12/37ed22b836438b23b9e97e768601e49d.png)
感谢您的来访,获取更多精彩文章请收藏本站。

- 最新
- 最热
只看作者