JavaScript实现音频和gif播放

最新推荐文章于 2023-10-31 22:52:38 发布

原创最新推荐文章于 2023-10-31 22:52:38 发布 · 1.7k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#js #javascript #html

HTML5/CSS3 同时被 2 个专栏收录

15 篇文章

订阅专栏

JavaScript

14 篇文章

订阅专栏

本文介绍了一个使用HTML、CSS和JavaScript创建的互动网页案例，通过图片按钮触发音乐播放和动画显示，展示了基本的网页交互设计技巧。

<!DOCTYPE html>
<html>
	<head>
		<title>练习3</title>
			<meta charset="UTF-8"/>
			<script>
				function play(){
							document.getElementById("Run").style.display="block";
					}
			</script>
		</head>
	<body>
		<h2>点击按钮有惊喜！</h2><br>
		<input type="image" src="../images/play.jpg" onclick="play()"/>
		<div id="Run" style="display:none">
			<audio src="../other/1.mp3" controls="controls" autoplay="autoplay" loop="true"></audio><br>
			<img id="images" src="../images/2.gif" width="400px" height="200px"/>
		</div>
	</body>
</html>

效果
在这里插入图片描述