HTML5应用开发课后习题题库期末考试试卷及答案 (七).pdfVIP

实操题：

1.在网页中通过播“放,“暂停”两个按钮设置背景音乐地播放与关闭

效果如图5-9所示

藉放背景音乐暂停背景音也

图5-9习题1执行效果

参考代码：

!DOCTYPEhtml

html

head

metacharset=utf-8

titletesttitle

scriptlanguage=javascripttype=textjavascript

functionautoPlay{){

varmyAuto=document.getElementById(myaudio);

myAuto.play();

}

functionclosePlay(){

varmyAuto=document.getElementById(myaudio);

myAuto.pause();

myAuto.load();

)

script

head

body

audiosrc=,,srcl.mp3id=myaudiocontrols=controls

,

loop=falsehidden=true

audio

inputtype-buttononelick-autoPlay()value♦播放/

inputtype=buttononclick=closePlay()value=暂停/

body

html

2.设计网页版音乐播放器，如图5-10所示，点击IA播放当前音乐，旋转

控制当前音量地大小再点击，音乐暂停，按钮切换到图片“，❾停止旋转“削切

换到上一首与下一首音乐文字显示当前播放第*首音乐，也可以用来显示当前曲名地名称

当前正在播放:第1营

■A，

图5-10习题2执行效果

参考代码：

!D0CTYPEhtml

html

head

metacharset=*utf-8

简单音乐播放器

stletpe=text/css

#CDimageimg{

width:200px;

height:200px;

transform-origin:center;

animation:;

)

@keframesrounds{

from{