js图片自动切换的源码

请问网页上那种图片自动翻页的flash怎么搞得？比如csdn首页，中间偏上的图片，从第一张自动切换到第六张？谁给个源码啊？我要换图片谢谢啊

解决方案 »

  1.   

    给你段代码：你会看明白的。
    <html>
    <script language="javascript" type="text/javascript">
    //界面跳转
    function showPage1(){
    divPage1.style.display="block";
    divPage2.style.display="none";
    main_0.style.background="#D7F2FF";
    main_1.style.background="#FFFFFF";
    }function showPage2(){
    divPage1.style.display="none";
    divPage2.style.display="block";
    main_0.style.background="#FFFFFF";
    main_1.style.background="#D7F2FF";

    }
    //图片轮放
    var Timer=0;
    var time = "";
    function mouseoverStop()
    {
    window.clearInterval(time);
    }
    function mouseover(obj)
    {
    window.clearInterval(time);
    obj.style.cursor="hand";
    var array=pwSlidePlayer.getElementsByTagName("div");
    var move=pic.getElementsByTagName("td");
    document.getElementById(array[Timer].id).style.display="none";
    move[Timer].bgColor="#000000";
    for(i=0;i<move.length;i++)
    {
    if(move[i].id==obj.id)
    {
    Timer=i;
    document.getElementById(array[Timer].id).style.display="block";
    move[Timer].bgColor="FF0033";
    }
    }
    }
    function mouseout()
    {
    time = window.setInterval("SlidePlayer();",1000);
    }function SlidePlayer()
    {
    var array=pwSlidePlayer.getElementsByTagName("div");
    var move=pic.getElementsByTagName("td");                                                                              
    if(array[Timer].style.display=="block")
    {
    document.getElementById(array[Timer].id).style.display="none";
    move[Timer].bgColor="#000000";
    Timer++;
    }
    Timer=Timer%5;
    document.getElementById(array[Timer].id).style.display="block";
    move[Timer].bgColor="FF0033";
    //alert(array.length);
    }
    window.onload = function()
    {
    userName="admin";
    time=window.setInterval("SlidePlayer();", 1000);
    }
    </script>
    <body>
    <!--图片轮放-->
            <DIV id="pw" style=" float:left; padding-left:20px;padding-top:10px; width:300px; height:198px;">       
                  <div id="pwSlidePlayer" onmouseover="mouseoverStop();" onmouseout="mouseout();" >            
                        <div id="Switch_1" name="switch" style=" height:197px;"><A href="#" target=_self ><a href="#" target=_self ><img src="../images/main1.jpg" /></a></div>
                        <div id="Switch_2" name="switch" style="DISPLAY: none"><A href="#" target=_blank><IMG src="../images/main2.jpg"> </A></div>
                        <div id="Switch_3" name="switch" style="DISPLAY: none"><A href="#" target=_blank><IMG src="../images/main3.jpg"> </A></div>
                        <div id="Switch_4"  name="switch" style="DISPLAY: none;"><A href="#" target=_blank><IMG src="../images/main4.jpg"> </A></div>
                     <div id="Switch_5" name="switch" style="DISPLAY: none"><A href="#" target=_blank><IMG src="../images/main5.jpg"> </A></div>              
                  </div>   
         <!--数字控制-->               
                  <div id="pic"  style=" margin-top:-28px; margin-right:-280px">
                    <table width="102">
                        <tr style="text-align:center">
                            <td id="Num1" name="num" width="16" bgcolor="#FF0033" onmouseover="mouseover(this)" onmouseout="mouseout()"><font color="#FFFFFF">1</font></td>
                            <td id="Num2" name="num" width="16" bgcolor="#000000" onmouseover="mouseover(this)" onmouseout="mouseout()"><font color="#FFFFFF" >2</font></td>
                            <td id="Num3" name="num" width="16" bgcolor="#000000" onmouseover="mouseover(this)" onmouseout="mouseout()" ><font color="#FFFFFF" >3</font></td>
                            <td id="Num4" name="num" width="16" bgcolor="#000000" onmouseover="mouseover(this)" onmouseout="mouseout()"><font color="#FFFFFF">4</font></td>
                            <td id="Num5" name="num" width="16" bgcolor="#000000" onmouseover="mouseover(this)" onmouseout="mouseout()"><font color="#FFFFFF" >5</font></td>
                      </tr>
                    </table>
                  </div>          
            </DIV>
     </body>
     </html>