用html js实现 单击文字然后播放音乐的功能

用html js实现 单击文字然后播放音乐的功能,第1张

代码

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<audio id="player">
        <source src="092 AC DC - You Shook Me All Night Longmp3"></source>
    </audio>
    <div style="width: 100%;text-align: center;"><span style="cursor: pointer;" id="start">开始</span></div>
    <div style="width: 100%;text-align: center;"><span style="cursor: pointer;" id="stop">暂停</span></div>
</body>
<script type="text/javascript">
documentgetElementById('start')onclick = function(){
playerplay();
}
documentgetElementById('stop')onclick = function(){
playerpause();
}
</script>
</html>

HTML插入音乐自动播放的代码(代码可直接运行)<!DOCTYPE html><html><head>。

<meta charset="UTF-8" /><title>HTML5学堂 - >

特点

超文本标记语言文档制作不是很复杂,但功能强大,支持不同数据格式的文件镶入,这也是万维网(>

简易性:超文本标记语言版本升级采用超集方式,从而更加灵活方便。

可扩展性:超文本标记语言的广泛应用带来了加强功能,增加标识符等要求,超文本标记语言采取子类元素的方式,为系统扩展带来保证。

平台无关性:虽然个人计算机大行其道,但使用MAC等其他机器的大有人在,超文本标记语言可以使用在广泛的平台上,这也是万维网(>

通用性:另外,HTML是网络的通用语言,一种简单、通用的全置标记语言。它允许网页制作人建立文本与相结合的复杂页面,这些页面可以被网上任何其他人浏览到,无论使用的是什么类型的电脑或浏览器。

百度百科-HTML

不间断滚动代码:
</p>
<div id=demo style=overflow:hidden;height:300;width:150>
<div id=demo1>
<img src='roll/1png'><br>
<img src='roll/2png'><br>
<img src='roll/3png'><br>
<img src='roll/4png'><br>
<img src='roll/5png'><br>
<img src='roll/6png'><br>
<img src='roll/7png'><br>
<img src='roll/8png'><br>
<img src='roll/3png'><br>
<img src='roll/4png'><br>
<img src='roll/5png'><br>
<img src='roll/6png'><br>
<img src='roll/7png'><br>
<img src='roll/8png'><br>
<img src='roll/2png'><br>
</div>
<div id=demo2></div>
</div>
<p>
<script>
var speed=30;
demo2innerHTML=demo1innerHTML
function Marquee()
{
if(demo2offsetTop-demoscrollTop<=0)
demoscrollTop-=demo1offsetHeight;
else
demoscrollTop++;
}
var MyMar=setInterval(Marquee,speed)
demoonmouseover=function() {clearInterval(MyMar)}
demoonmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
</p>
插入音乐代码:
1 如何贴rm,ra,ram类型的音乐,代码如下:
<embed width="0" height="0" type="audio/x-pn-realaudio-plugin" autostart="true" controls="ControlPanel" src=">

第一段:

<embed src="等一分钟mp3" id="aa">
<input type=button value=暂停 onclick="aapause();">
<input type=button value=播放 onclick="aaplay();">

第二段:

<audio id="aaa" src="等一分钟mp3" autoplay controls></audio>
<input type=button value=暂停 onclick="aaapause();">
<input type=button value=播放 onclick="aaaplay();">

IE:支持第一段代码,不支持第二段代码

Firefox:支持第二段代码,第一段代码的第一行需要装插件,不支持第一段的后两行

Chrom:支持第二段代码,不支持第一段代码中的后两行

Opera,Safari:第一段代码的第一行需要装插件,不支持第一段的后两行,不支持第二段代码


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/yw/13329007.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-07-15
下一篇 2023-07-15

发表评论

登录后才能评论

评论列表(0条)

保存