实现图片轮流切换

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script language="javascript" src="jquery-132-min.js"></script>

<title>无标题文档</title>

<style >

.dangc{ float:left;}

</style>

</head>

<script language="javascript">

$(document).ready(function(){

img1=new Image();img2=new Image(); img3=new Image();

img1.src="1.png";img2.src="2.png";img3.src="3.png";

var i=0;

function qih(){

i=i+1

if (i>3) i=1;

$('.dangc').html('<img src="'+i+'.png" width="468" height="390" border="0" usemap="#Map" />');

}

var timer=setInterval(qih,1000);

})

function slit(ints){

$('.dangc').html('<img src="'+ints+'.png" width="468" height="390" border="0" usemap="#Map" />');

}

</script>

<body>

<div>

<div>

<div class="dangc"><img src="1.png" width="468" height="390" border="0" usemap="#Map" /></div>

<map name="Map" id="Map">

<area shape="rect" coords="151,12,391,97" οnmοusemοve="slit('1')" />

<area shape="rect" coords="376,132,483,347" οnmοusemοve="slit('3')" />

<area shape="rect" coords="45,107,154,320" οnmοusemοve="slit('2')" />

</map>

<img src="right.png" width="532" height="390" />

</div>

</body>

</html>


版权声明:本文为gangdaofeix原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
THE END
< <上一篇
下一篇>>