没事突然自己想做个网页,然后里面有个音乐可以听听,下面是一个类似一个相册的,带有音乐播放的代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>带声音的图片切换</title>
<script language="javascript" type="text/javascript">
var image;
var current = 0;
var images = new Array(5);
var timerID;
function init(){
for(var i=0;i<images.length;i++){
images[i] = new Image(500,500);
images[i].src = "images/"+i+".jpg";
}
image = document.images[0];
}
function setSrc(i){
current = i;
image.src = images[i].src;
}
function next(){
if(current>=4){
return false;
}else{
current++;
setSrc(current);
}
}
function previous(){
if(current<=0){
return false;
}else{
current--;
setSrc(current);
}
}
function play(){
if(current>=4){
current=-1;
}
setSrc(++current);
}
</script>
</head>
<body onload='init()'>
<form id="from1" name="myform" method="post" action="" >
<input type="button" name="Submit1" value="第一张" onclick="setSrc(0)"/>
<input type="button" name="Submit2" value="上一张" onclick="previous()"/>
<input type="button" name="Submit3" value="下一张" onclick="next()"/>
<input type="button" name="Submit4" value="最后一张" onclick="setSrc(4)"/>
<input type="button" name="Submit5" value="幻灯播放" onclick="timerID=setInterval(play,1000)"/>
<input type="button" name="Submit6" value="停止播放" onclick="clearInterval(timerID)"/>
<input type="button" name="Submit7" value="播放音乐" onclick="document.getElementById('sound').Play()"/>
<input type="button" name="Submit7" value="暂停音乐" onclick="document.getElementById('sound').Pause()"/>
<input type="button" name="Submit7" value="停止播放音乐音乐" onclick="document.getElementById('sound').Stop()"/>
</form>
<p>
<div align="center"><img src="images/0.jpg"</div>
</p>
<!-- 潜入声音文件-->
<embed id="sound" src="RainAndTears.mp3" autostart="true" loop="true" width="0" height="0"></embed>
</body>
</html>
然后就能边欣赏图片,边听音乐了!
分享到:
相关推荐
让课堂充满生长的气息.doc
初中语文语文论文让语文课充满生活的气息的方法
Foodie包含31款充满少女气息的滤镜,适合美食、静物、清新人像等。现全套转换为3D LUTs(.3dl/cube)文件,PS/PR/AE/FCPX可用。
让生活充满音乐:QQ音乐产品体验报告_产品体验报告产品经理互联网运营文档技能APP竞品需求分析.pdf
登陆界面,基于HTML+CSS3构建,充满机械风格的科幻气息画面,喜欢类似风格的小伙伴可以直接拿来做为登录界面,基本不需要改动
指导你熟练运用电脑技巧,帮助你真正掌握电脑技能学习电脑应用的技巧与方法是至关重要的一步。主要内容:表格动态与互特效;CSS滤镜高级应用;...许多使网页充满活力的窍门;典型技巧在实例中充分体现。
用jquery开发的输入框美化,加上css 的包装。很漂亮的哦。相信您一定喜欢
本网页以介绍古徽州为主题,包含了饮食、文化、地理、旅游、历史等各个方面的知识。绝对能够为对徽州文化感兴趣的你带来大量...希望能够带大家进入这已渐渐离我们远去的古徽州,感受先人们充满优雅闲适气息的生活方式。
浅谈如何让课堂充满智慧
当你需要给别人浪漫的时候 却没有钱的时候 你就可以用到 送给ta
励志赠言-每日一句,让你每天充满能量.doc
励志赠言-每日一句,让你每天充满能量精选.doc
在前端页面布局中,经常会碰到要让容器充满整个屏幕高度或者剩余屏幕高度的需求。一般这时候都会想当然的使用 height:100% 这样的 CSS 来写。这样写的话,当容器内内容很多的时候是没有问题的,可以达到预期的效果,...
如何让你的品牌充满个性.doc
本文主要为充电器充满自停电路图,希望对你的学习有所帮助。
让你的照片充满感情的色彩概述.pdf
36个充满紧张神秘感的背景音乐素材
网页设计时用的按钮声音,可以让你制作的网页充满色彩。