1、HTML结构
<img src="1.png" id="test">
2、javascript代码
function change(n){
if(n>5) n=1 // 一共5张图片，所以循环替换
document.getElementById("test").setAttribute("src", n+".png")
n++
setTimeout("change("+n+")",1000)
}
window.onload = function(){
setTimeout("change(1)", 1000)
}
用canvas吧 html5的 很好弄这个，我用它做了个路由器流量监控的 也是模仿任务管理器的曲线图
看图。。
每幅图3个canvas标签，显示的图像=背景色+另外两个的图像
一个是纯黑色背景，每次刷新都全部覆盖掉，再把下两个贴上去。
二个是网格，先画好（只画了横线），每次刷新就贴到第一个就好了
三是曲线了，宽度很宽（3000px），每次刷新时往后画几个像素，在贴到第一个就好了（往前移动几个像素）
搞定。
<script type="text/javascript">window.onload = function(){
var c = document.getElementById("myCanvas")
var content = c.getContext("2d")
//绘制二次方贝塞尔曲线
content.strokeStyle ="#FF5D43"
content.beginPath()
content.moveTo(0,200)
content.quadraticCurveTo(75,50,300,200)
content.stroke()
content.globalCompositeOperation = "source-over" //目标图像上显示源图像
//绘制上面曲线的控制点和控制线，控制点坐标为两直线的交点(75,50)
content.strokeStyle = "#f0f"
content.beginPath()
content.moveTo(75,50)
content.lineTo(0,200)
content.moveTo(75,50)
content.lineTo(300,200)
content.stroke()
}
