<script type="text/javascript">
window.onload = function (){
  autoMove()
}
   
      var  tmer = null ; 
var i;


function autoMove(){
var oul = document.getElementById('oul');
var oimg = oul.getElementsByTagName('img');

tmer = setInterval ( function (){
      for(i=0;i<oimg.length;i++)
{
              move(oimg[i],{opacity:0})
//这样的话它将5 个一并遍历出来,不是我想要的效果,我要的是1 秒种换一张,如何实现呢
}
      
},1000)
} </script>

解决方案 »

  1.   


    var  tmer = null, i=0, len=0        
    function autoMove(){
      var oul = document.getElementById('oul');
      var oimg = oul.getElementsByTagName('img');
      len=oimg.length;
      i=len-1 ? 0 : i++;   //这样试试
      tmer = setInterval ( 
        function (){ move(oimg[i],{opacity:0}) },1000
      )
    }
      

  2.   

    还是不行,没有任何效果
     function (){ move(oimg[i],{opacity:0});
      alert (i)  // 老是0
     }
      

  3.   

     var oul = document.getElementById('oul'); 获取ID为oul这个对象
    var oimg = oul.getElementsByTagName('img');这句你是干什么? 你根据这个ID可以获取到多个img???? ,贴你的HTML代码出来看看
      

  4.   

    <!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" />
    <title>无标题文档</title>
    <script type="text/javascript" src="jscript/setMove.js"  > </script>
    <style type="text/css">
    * { padding:0; margin:0 }#oul { width:500px; height:300px; overflow:hidden; position:relative; margin:100px; }#oul li img { width:500px; height:300px; position:absolute; top:0; left:0; filter: alpha( opacity:100);
    opacity:1; z-index:0; }
    </style>
    </head>
    <body>
    <ul  id="oul">
       <li><img src="images/1.jpg" /></li>
       <li><img src="images/2.jpg" /></li>
       <li><img src="images/3.jpg" /></li>
       <li><img src="images/4.jpg" /></li>
       <li><img src="images/5.jpg"/></li>
    </ul>
    <script type="text/javascript">
    window.onload = function (){
      autoMove()
    }
       
          var  tmer = null ; 
    var i;
    var len;

    function autoMove(){
    var oul = document.getElementById('oul');
    var oimg = oul.getElementsByTagName('img'); tmer = setInterval ( function (){
      if(i<oimg.length)
    {
      move(oimg[i],{ opacity:0})
        i++;
    }
    else
    {
     i=0;
    }
              
    },1000)
    } </script>
    </body>
    </html>
    下面是外部move()
      
    // JavaScript Document
     function getStyle(obj,attr)
       {
         if( obj.currentStyle)
       {
          return obj.currentStyle[attr];
       }
         else
          {
             return getComputedStyle( obj,false)[attr];
          }
       }
               
           function move(obj,json,fn){
        clearInterval (obj.timer)
        obj.timer= setInterval( function()
        {   
                 var allStop = true;    //所有对象移动停止;
               for(attr in  json)
                {
    //  检测对象
    var  icurr = 0;
    if(attr=='opacity')

    {
    icurr= parseInt(parseFloat(getStyle(obj,attr))*100);

    }   
    else
    {
    icurr =  parseInt(getStyle(obj,attr));
    }
    //计算速度
    var ispeed =(json[attr]-icurr)/8;
    ispeed=ispeed>0?Math.ceil(ispeed)  :  Math.floor(ispeed); 
    //检测结果  
    if( icurr != json[attr])
    {  
         allStop = false ;


    if(attr=='opacity')
    {

    obj.style.filter = 'alpha(opacity:'+(icurr+ispeed)+')';
    obj.style.opacity = (icurr+ispeed)/100 ;
    }
    else
    {
    obj.style[attr] =icurr+ispeed +'px';
    }
    }
            if(allStop)
          {
    clearInterval( obj.timer) 
    if(fn)
    {
    fn();
    }



    }
         },30)
        }我将js代码改成这样的,全所有的图片一下渐隐,
      

  5.   

    我遇到的问题是无法分开  对move()的调用 ,初学
      

  6.   

    把1楼的代码改了改,你试试:
    1楼代码有两个问题:1.三目运算的判断貌似有问题,2.变量i自增位置貌似也放错了,定时函数不是autoMove;var  tmer = null, i=0, len=0        
    var  tmer = null, i=0, len=0        
    function autoMove(){
      var oul = document.getElementById('oul');
      var oimg = oul.getElementsByTagName('img');
      len=oimg.length;
       //后面的img在上
       i=len-1;
      tmer = setInterval ( 
        function (){ 
              move(oimg[i],{opacity:0});
              i==0? len-1 : i--;   //这样试试
         },1000
      )
    }
      

  7.   

    确实有问题。
    如果你只是页面加载后定时调用move函数,就不用再定义一个automove()了;直接在onload里写代码就可以了:var  tmer = null, i=0
    window.onload = function (){
      //autoMove();
      var oul = document.getElementById('oul');
      var oimg = oul.getElementsByTagName('img');
      tmer = setInterval (
        function (){
          move(oimg[i],{opacity:0}); 
          i++; 
          if(i==oimg.length){i=0;}
        },1000
      )
    }
      

  8.   

    已经解决,用六楼的方法,
    可能我在问题的描述上不是很清楚吧,让大家不明白,
    我再加了一个索引值,一直循环下去。
    下面是最终的JS CODE;       var  tmer = null ,len,imZindex =0;
    window.onload = function (){
      //autoMove();
      var oul = document.getElementById('oul');
      var oimg = oul.getElementsByTagName('img');    len=oimg.length;
       //后面的img在上
       i=len-1;
      tmer = setInterval ( 
        function (){ 
              move(oimg[i],{opacity:0});
    oimg[i].style.Zindex =imZindex++;
    if(i==0){
    i=len-1;
    }
    else

       i--;
    }
        move(oimg[i],{opacity:100});
         },2000
      )

    }