html中图片自动轮番显示代码

本文将介绍如何使用HTML实现图片自动轮番显示的功能。

首先我们需要准备一些图片，这些图片应该放在image文件夹下。下面是这些图片的文件名：

1.jpg
2.jpg
3.jpg
4.jpg
5.jpg

接下来，我们需要在HTML文档中插入以下代码：

<div id="imgarea"></div>

在这个div标签中，我们可以使用JavaScript来动态改变其中的内容。接下来，我们需要在JavaScript中实现自动改变图片的功能：

var mm=0; 
var nn=0; 
function show_pic() 
{ 
var imgaeArea=document.getElementById("imgarea"); 
if (mm==5){mm=0} 
mm++; 
imgaeArea.innerHTML="" 
setTimeout("show_pic()",1000); 
}

在这段代码中，我们定义了两个全局变量mm和nn，它们用于控制图片序号的变化。show_pic()函数是我们的核心函数，在这个函数中，我们首先获取图片区域的div标签，并定义一个条件语句来实现图片序号的循环。然后，我们动态地改变div标签中的内容，用来显示不同的图片。最后，我们使用setTimeout()函数来实现每秒调用一次show_pic()函数，从而实现自动轮番显示图片的功能。

最后，我们需要在HTML文档的头部中引入JavaScript代码：

<script type="text/javascript"> 
var mm=0; 
var nn=0; 
function show_pic() 
{ 
var imgaeArea=document.getElementById("imgarea"); 
if (mm==5){mm=0} 
mm++; 
imgaeArea.innerHTML="" 
setTimeout("show_pic()",1000); 
} 
</script>

当我们打开网页时，就会看到自动轮番显示的图片效果了。