请大家推荐一个比较好的首页图片轮换程序,带有标题行,能够和asp结合使用


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> 图片切换效果</TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<style type='text/css'>
.bigon{background:url(http://mat1.qq.com/ent/ent2007/ent2-04.gif);color:#C9000E;}
    .bigoff{background:url(http://mat1.qq.com/ent/ent2007/ent2-03.gif);color:#3C3C3C;}
</style></HEAD><BODY>
<table width="350" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td width="344">
    <table width="332" border="0" align="center" cellpadding="0" cellspacing="1">
            <tr>
              <td width="330" style="border:1px solid #4F4F4F;"><div id="fc" style="width:328px;height:240px;filter:progid:DXImageTransform.Microsoft.Fade ( duration=0.5,overlap=1.0 );"><div style="display:block;">
<a href="http://ent.qq.com/a/20080618/000007.htm" target="_blank"><img src="http://mat1.qq.com/ent/upday2008/06182.jpg" width="328" height="240" border="0" onMouseOver="ClearTime();" onMouseOut="ImgChange()" /></a></div>
<div style="display:none;">
<a href="http://ent.qq.com/a/20080618/000104.htm" target="_blank"><img src="http://mat1.qq.com/ent/upday2008/06188.jpg" width="328" height="240" border="0" onMouseOver="ClearTime();" onMouseOut="ImgChange()" /></a></div> 
<div style="display:none;"><a href="http://ent.qq.com/a/20080618/000002.htm" target="_blank"><img src="http://mat1.qq.com/ent/upday2008/06184.jpg" width="328" height="240" border="0" onMouseOver="ClearTime();" onMouseOut="ImgChange()" /></a></div><div style="display:none;">
<a href="http://ent.qq.com/a/20080618/000048.htm" target="_blank"><img src="http://mat1.qq.com/ent/upday2008/06187.jpg" width="328" height="240" border="0" onMouseOver="ClearTime();" onMouseOut="ImgChange()" /></a></div><div style="display:none;">
<a href="http://ent.qq.com/a/20080618/000109.htm" target="_blank"><img src="http://mat1.qq.com/ent/upday2008/06186.jpg" width="328" height="240" border="0" onMouseOver="ClearTime();" onMouseOut="ImgChange()" /></a></div>
    </div>
</td>
            </tr>
            <tr>
              <td height="31" background="http://mat1.qq.com/ent/ent2007/ent2-02.gif"><table width="328" border="0" align="center" cellpadding="0" cellspacing="0">
                  <tr>
                    <td width="228" align="center" onmouseover="ClearTime();" onMouseOut="ImgChange()"><div id="con"><div style="display:block;">
<a href="http://ent.qq.com/a/20080618/000007.htm" target="_blank" class="bla">关之琳穿花裙高调亮相 灿烂醉笑日渐显老</a></div> 
<div style="display:none;">
<a href="http://ent.qq.com/a/20080618/000104.htm" target="_blank" class="bla">《嫂嫂19岁》导演李昌汉要在内地选女主角</a></div>
<div style="display:none;">
<a href="http://ent.qq.com/a/20080618/000002.htm" target="_blank" class="bla">《剑蝶》迟到引不满 吴尊阿sa感情甚好</a></div>
<div style="display:none;">
<a href="http://ent.qq.com/a/20080618/000048.htm" target="_blank" class="bla">成龙与儿子合作 拳打脚踢为《熊猫》配音</a></div> 
<div style="display:none;">
<a href="http://ent.qq.com/a/20080618/000109.htm" target="_blank" class="bla">林嘉欣踏入三十岁 希望早点结婚生孩子</a></div>
                </div></td>
                    <td width="100"><table width="83" border="0" align="center" cellpadding="0" cellspacing="3" class="lhn" id="num">
                        <tr>
                          <td width="13" height="19" align="center" background="http://mat1.qq.com/ent/ent2007/ent2-04.gif" class="bigon" onclick="ChangeStart(0);" onmouseover="ClearTime();" onmouseout="ImgChange()" style="cursor:pointer;">1</td>
                          <td width="13" align="center" background="http://mat1.qq.com/ent/ent2007/ent2-03.gif" class="bigoff" onclick="ChangeStart(1);" onmouseover="ClearTime();" onmouseout="ImgChange()" style="cursor:pointer;">2</td>
                          <td width="13" align="center" background="http://mat1.qq.com/ent/ent2007/ent2-03.gif" class="bigoff" onclick="ChangeStart(2);" onmouseover="ClearTime();" onmouseout="ImgChange()" style="cursor:pointer;">3</td>
                          <td width="13" align="center" background="http://mat1.qq.com/ent/ent2007/ent2-03.gif" class="bigoff" onclick="ChangeStart(3);" onmouseover="ClearTime();" onmouseout="ImgChange()" style="cursor:pointer;">4</td>
                          <td width="13" align="center" background="http://mat1.qq.com/ent/ent2007/ent2-03.gif" class="bigoff" onclick="ChangeStart(4);" onmouseover="ClearTime();" onmouseout="ImgChange()" style="cursor:pointer;">5</td>
     </tr>
    </table></td>
    </tr>
</table></td>
</tr>
</table>
<SCRIPT LANGUAGE="JavaScript">
<!--
/*
   作品：图片切换效果
   主要应用：filter:progid:DXImageTransform.Microsoft.Fade ( duration=0.5,overlap=1.0 )
*/
var n = 0;
var Timer = null;
var oBackImg = document.getElementById('num');//初始化函数
function InitParm(){
   n++;
   if(n>4)n=0;
   ChangeStart(n);
}
function ChangeStart(n){
   ImgSel(n);//图片切换
   LinkChange(n);//超链接切换
   BackImg(n);//小图片背景切换  
}
// 定时图片切换
function ImgSel(num){
   with(fc){
    filters[0].Apply();//初始化滤镜
    for(var i = 0;i < 5; i++) (i == num) ? (childNodes[i].style.display = "block") : (childNodes[i].style.display = "none");
    filters[0].play();//滤镜使用
   }  
}// 定时超链接切换
function LinkChange(num){
   with(con){
    for(var i = 0;i < 5; i++) i == num?childNodes[i].style.display = "block":childNodes[i].style.display = "none";  
   }
  
}
// 定时小背景图片切换
function BackImg(len){
for(var i=0;i<5;i++)
   if(len==i){
   oBackImg.getElementsByTagName("td")[i].className='bigon';
   } 
else{ 
   oBackImg.getElementsByTagName("td")[i].className='bigoff';
   } 
}//清除定时器
function ClearTime(){
   clearInterval(Timer);
}function ImgChange(){
   Timer = window.setInterval("InitParm()",3000);
}ImgChange();// 特别应用：图片转换滤镜的应用
//-->
</SCRIPT> 
</BODY>
</HTML>

解决方案 »

  1.   

    to:s_liangchao1s有一个小问题：
    当我选择某个数字时，比如说4，而当前正放到2，图片从2继续切换而不是从4开始向下切换
      

  2.   


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <TITLE> 图片切换效果</TITLE>
    <META NAME="Generator" CONTENT="EditPlus"><style type='text/css'>
    .bigon{background:url(http://mat1.qq.com/ent/ent2007/ent2-04.gif);color:#C9000E;}
        .bigoff{background:url(http://mat1.qq.com/ent/ent2007/ent2-03.gif);color:#3C3C3C;}
    </style></HEAD><BODY>
    <table width="350" border="0" cellspacing="0" cellpadding="0">
            <tr>
              <td width="344">
        <table width="332" border="0" align="center" cellpadding="0" cellspacing="1">
                <tr>
                  <td width="330" style="border:1px solid #4F4F4F;"><div id="fc" style="width:328px;height:240px;filter:progid:DXImageTransform.Microsoft.Fade ( duration=0.5,overlap=1.0 );"><div style="display:block;">
    <a href="http://ent.qq.com/a/20080618/000007.htm" target="_blank"><img src="http://mat1.qq.com/ent/upday2008/06182.jpg" width="328" height="240" border="0" onMouseOver="ClearTime();" onMouseOut="ImgChange()" /></a></div>
    <div style="display:none;">
    <a href="http://ent.qq.com/a/20080618/000104.htm" target="_blank"><img src="http://mat1.qq.com/ent/upday2008/06188.jpg" width="328" height="240" border="0" onMouseOver="ClearTime();" onMouseOut="ImgChange()" /></a></div> 
    <div style="display:none;"><a href="http://ent.qq.com/a/20080618/000002.htm" target="_blank"><img src="http://mat1.qq.com/ent/upday2008/06184.jpg" width="328" height="240" border="0" onMouseOver="ClearTime();" onMouseOut="ImgChange()" /></a></div><div style="display:none;">
    <a href="http://ent.qq.com/a/20080618/000048.htm" target="_blank"><img src="http://mat1.qq.com/ent/upday2008/06187.jpg" width="328" height="240" border="0" onMouseOver="ClearTime();" onMouseOut="ImgChange()" /></a></div><div style="display:none;">
    <a href="http://ent.qq.com/a/20080618/000109.htm" target="_blank"><img src="http://mat1.qq.com/ent/upday2008/06186.jpg" width="328" height="240" border="0" onMouseOver="ClearTime();" onMouseOut="ImgChange()" /></a></div>
        </div>
    </td>
                </tr>
                <tr>
                  <td height="31" background="http://mat1.qq.com/ent/ent2007/ent2-02.gif"><table width="328" border="0" align="center" cellpadding="0" cellspacing="0">
                      <tr>
                        <td width="228" align="center" onmouseover="ClearTime();" onMouseOut="ImgChange()"><div id="con"><div style="display:block;">
    <a href="http://ent.qq.com/a/20080618/000007.htm" target="_blank" class="bla">关之琳穿花裙高调亮相 灿烂醉笑日渐显老</a></div> 
    <div style="display:none;">
    <a href="http://ent.qq.com/a/20080618/000104.htm" target="_blank" class="bla">《嫂嫂19岁》导演李昌汉要在内地选女主角</a></div>
    <div style="display:none;">
    <a href="http://ent.qq.com/a/20080618/000002.htm" target="_blank" class="bla">《剑蝶》迟到引不满 吴尊阿sa感情甚好</a></div>
    <div style="display:none;">
    <a href="http://ent.qq.com/a/20080618/000048.htm" target="_blank" class="bla">成龙与儿子合作 拳打脚踢为《熊猫》配音</a></div> 
    <div style="display:none;">
    <a href="http://ent.qq.com/a/20080618/000109.htm" target="_blank" class="bla">林嘉欣踏入三十岁 希望早点结婚生孩子</a></div>
                    </div></td>
                        <td width="100"><table width="83" border="0" align="center" cellpadding="0" cellspacing="3" class="lhn" id="num">
                            <tr>
                              <td width="13" height="19" align="center" background="http://mat1.qq.com/ent/ent2007/ent2-04.gif" class="bigon" onclick="ChangeStart(0);" onmouseover="ClearTime();" onmouseout="ImgChange()" style="cursor:pointer;">1</td>
                              <td width="13" align="center" background="http://mat1.qq.com/ent/ent2007/ent2-03.gif" class="bigoff" onclick="ChangeStart(1);" onmouseover="ClearTime();" onmouseout="ImgChange()" style="cursor:pointer;">2</td>
                              <td width="13" align="center" background="http://mat1.qq.com/ent/ent2007/ent2-03.gif" class="bigoff" onclick="ChangeStart(2);" onmouseover="ClearTime();" onmouseout="ImgChange()" style="cursor:pointer;">3</td>
                              <td width="13" align="center" background="http://mat1.qq.com/ent/ent2007/ent2-03.gif" class="bigoff" onclick="ChangeStart(3);" onmouseover="ClearTime();" onmouseout="ImgChange()" style="cursor:pointer;">4</td>
                              <td width="13" align="center" background="http://mat1.qq.com/ent/ent2007/ent2-03.gif" class="bigoff" onclick="ChangeStart(4);" onmouseover="ClearTime();" onmouseout="ImgChange()" style="cursor:pointer;">5</td>
         </tr>
        </table></td>
        </tr>
    </table></td>
    </tr>
    </table>
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    /*
       作品：图片切换效果
       主要应用：filter:progid:DXImageTransform.Microsoft.Fade ( duration=0.5,overlap=1.0 )*/
    var n = 0;
    var Timer = null;
    var oBackImg = document.getElementById('num');//初始化函数
    function InitParm(){
       n++;
       if(n>4)n=0;
       ChangeStart(n);
    }
    function ChangeStart(value){
        n = value;
       ImgSel(value);//图片切换
       LinkChange(value);//超链接切换
       BackImg(value);//小图片背景切换  
    }
    // 定时图片切换
    function ImgSel(num){
       with(fc){
        filters[0].Apply();//初始化滤镜
        for(var i = 0;i < 5; i++) (i == num) ? (childNodes[i].style.display = "block") : (childNodes[i].style.display = "none");
        filters[0].play();//滤镜使用
       }  
    }// 定时超链接切换
    function LinkChange(num){
       with(con){
        for(var i = 0;i < 5; i++) i == num?childNodes[i].style.display = "block":childNodes[i].style.display = "none";  
       }
      
    }
    // 定时小背景图片切换
    function BackImg(len){
    for(var i=0;i<5;i++)
       if(len==i){
       oBackImg.getElementsByTagName("td")[i].className='bigon';
       } 
    else{ 
       oBackImg.getElementsByTagName("td")[i].className='bigoff';
       } 
    }//清除定时器
    function ClearTime(){
       clearInterval(Timer);
    }function ImgChange(){
       Timer = window.setInterval("InitParm()",3000);
    }ImgChange();// 特别应用：图片转换滤镜的应用
    //-->
    </SCRIPT> 
    </BODY>
    </HTML>