<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
function init(){
setInterval('a()',2000);
}
var i=2;
function a(){
i++;
document.getElementById("a").src="img/"+i+".jpg"
if(i==4){
i=1;
}
}
</script>
</head>
<body onload="init()">
<div>
<img src="img/2.jpg" id="a">
</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
function init(){
setInterval('a()',1000);
t=setInterval('b()',4000);
}
var i=2;
function a(){
i++;
document.getElementById("a").src="img/"+i+".jpg";
if(i==4){
i=1;
}
}
function b(){
var c=document.getElementById("b");
c.style.display="block";
clearInterval(t)
t=setInterval('e()',20000);
}
function e(){
document.getElementById("b").style.display="none";
clearInterval(t);
}
</script>
</head>
<body onload="init()">
<div>
<img src="img/1.jpg" style="display: none;" id="b">
</div>
<div>
<img src="img/2.jpg" id="a">
</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
function init(){
setInterval('a()',1000);
t=setInterval('b()',2000);
}
var i=1;
function a(){
i++;
document.getElementById("a").src="img/"+i+".jpg";
if(i==4){
i=0;
}
}
function b(){
var a=document.getElementById("b");
a.style.display="block";
clearInterval(t);
t=setInterval('c()',4000);
}
function c(){
document.getElementById("b").style.display="none";
}
</script>
</head>
<body onload="init()">
<img src="img/1.jpg" style="display: none;" id="b">
<div>
<img src="img/1.jpg" id="a">
</div>
</body>
</html>