js首页图片切换

<style type="text/css"> 

.js_picshow { z-index:444; position:relative; background-color:#e4f2fa; width: 100%; height: 250px}

.js_picshow_main { position: relative; width: 690px; height: 250px}

.js_picshow_main .imgbig { filter: progid:dximagetransform.microsoft.wipe(gradientsize=1.0,wipestyle=4, motion=forward); width: 690px; height: 250px}

.js_picshow_change {position: absolute; text-align: left; bottom: -183px; height: 30px;  left: 570px;}

.js_picshow_change img {width:15px; height: 15px}

.js_picshow_change a { border: 1px solid; display: block; float: left; margin-right: 5px;  -display: inline}

a.js_axx { border-color: #555}

a.js_axx:hover {border-color: #000}

a.js_axx img { filter: alpha(opacity=40); opacity: 0.4; -moz-opacity: 0.4}

a.js_axx:hover img {filter: alpha(opacity=100); opacity: 1.0; -moz-opacity: 1.0}

a.js_bxx { border-color: #000}

a.js_bxx:hover {border-color: #000}

img{

border:0px}

</style>

<SCRIPT language=javascript> 

 //图片滚动展示 Start

 var counts = 3;

 //大图//

 img1 = new Image();

 img1.src = 'http://www.g4qq.com/skin/frontend/default/hellowired/images/media/z1.gif';

 img2 = new Image();

 img2.src = 'http://www.g4qq.com/skin/frontend/default/hellowired/images/media/z2.gif';

 img3 = new Image();

 img3.src = 'http://www.g4qq.com/skin/frontend/default/hellowired/images/media/z3.gif';

 

 var smallImg = new Array();

 //小图

 smallImg[0] = 'http://www.g4qq.com/skin/frontend/default/hellowired/images/media/index_adb1.gif';

 smallImg[1] = 'http://www.g4qq.com/skin/frontend/default/hellowired/images/media/index_adb2.gif';

 smallImg[2] = 'http://www.g4qq.com/skin/frontend/default/hellowired/images/media/index_adb3.gif';

 

 //链接地址

 url1 = new Image();

 url1.src = 'http://www.jz123.cn/';

 url2 = new Image();

 url2.src = 'http://ziti.jz123.cn';

 url3 = new Image();

 url3.src = 'http://ziti.jz123.cn';

 //alt值

 alt1 = new Image();

 alt1.alt = '现在购买虚拟主机免费开通在线客服功能（渠道除外）';

 alt2 = new Image();

 alt2.alt = '建站普及风暴，圣诞元旦礼上礼';

 alt3 = new Image();

 alt3.alt = '冬日暖阳 年度双薪';

 欢迎来到标准之路.

 var nn = 1;

 var key = 0;

 function change_img() {

  if (key == 0) {

   key = 1;

  } else if (document.all) {

   document.getElementById("pic").filters[0].Apply();

   document.getElementById("pic").filters[0].Play(duration = 2);

  }

  eval('document.getElementById("pic").src=img' + nn + '.src');

  eval('document.getElementById("url").href=url' + nn + '.src');

  eval('document.getElementById("pic").alt=alt' + nn + '.alt');

  if (nn == 1) {

   document.getElementById("url").target = "_blank";

   document.getElementById("url").style.cursor = "pointer";

  } else {

   document.getElementById("url").target = "_blank"

   document.getElementById("url").style.cursor = "pointer"

  }

 

  for ( var i = 1; i <= counts; i++) {

   document.getElementById("xxjdjj" + i).className = 'js_axx';

  }

  document.getElementById("xxjdjj" + nn).className = 'bxx';

  nn++;

  if (nn > counts) {

   nn = 1;

  }

  tt = setTimeout('change_img()', 4000);

 }

 function changeimg(n) {

  nn = n;

  window.clearInterval(tt);

  change_img();

 }

 function ImageShow() {

  document.write('<div class="js_picshow_main">');

  document.write('<div><a id="url"><img id="pic" class="imgbig" style="width:640px;height:426px;"/></a></div>');

  document.write('<div class="js_picshow_change">');

  for ( var i = 0; i < counts; i++) {

   document.write('<a href="javascript:changeimg(' + (i + 1)

     + ');" id="xxjdjj' + (i + 1)

     + '" class="js_axx" target="_self"><img src="' + smallImg[i]

     + '"></a>');

  }

  document.write('</div></div>');

  change_img();

 }

 //图片滚动展示 End

</SCRIPT>

<SCRIPT language="javascript" type="text/javascript"> 

 ImageShow();

</SCRIPT>