HTML5中多页面实现背景音乐的连续播放
前几天老师布置了一个课程作业，用所学HTML5相关知识写几个页面出来，于是就开始了制作：
做到最后效果如图：
这是其中一个页面的图片，头部六个都是跳转到其他相关页面的标题，此时我在主页中添加了背景播放音乐：
<!--添加音频播放，设置为自动播放,并隐藏播放控件的显示--> <audio controls="controls" autoplay="autoplay" controls="controls" hidden="hidden"> <source src="file/tears.mp3" type="audio/mp3"> <source src="file/tears.mp3" type="audio/ogg"> <embed height="50px" width="100px" src="file/tears.mp3"> </audio>
但是当跳转到其他页面时，背景音乐就没了，此时若在其他页面添加相同的audio控件，那么跳转后音乐会重新播放
因此想办法让他能够在跳转后能够继续播放此音乐：
新建一个music.html页面：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <!--添加音频播放，设置为自动播放,并隐藏播放控件的显示--> <audio controls="controls" autoplay="autoplay" controls="controls" hidden="hidden"> <source src="file/tears.mp3" type="audio/mp3"> <source src="file/tears.mp3" type="audio/ogg"> <embed height="50px" width="100px" src="file/tears.mp3"> </audio> </body> </html>
将原先其他页面中的媒体播放控件都去掉
再新建一个backMusic.html页面：
<!DOCTYPE html> <html> <frameset cols="0%,100%"> <frame src="music.html"/> <frame src="index.html" /> </frameset> </html>
此时以此页面为主页运行即可达到预想的效果。
我把源码贴在了网上有需要的自己去下载吧：http://www.17sucai.com/pins/30768.html
