Juery 实现淡出淡现效果

HTML：

<!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=gb2312" />

<meta http-equiv="Cache-Control" content="no-transform " />

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

<script type="text/javascript" src="jquery-1.10.1.js"></script>

<style type="text/css">

ul,ol,li{list-style:none;}

  .box{width:320px; height:240px;}

  .box ul li {float:left; position:absolute; display:none;width:320px; height:240px;}

</style>

</head>

<body>

<div class="box">

  <ul>

    <li><a href="#" target="_blank"><img src="data:images/1.jpg" width="350" height="240" /></a></li>

    <li><a href="#" target="_blank"><img src="data:images/2.jpg" width="350" height="240" /></a></li>

    <li><a href="#" target="_blank"><img src="data:images/3.jpg" width="350" height="240" /></a></li>

    <li><a href="#" target="_blank"><img src="data:images/4.jpg" width="350" height="240" /></a></li>

    <li><a href="#" target="_blank"><img src="data:images/5.jpg" width="350" height="240" /></a></li>

    <li><a href="#" target="_blank"><img src="data:images/6.jpg" width="350" height="240" /></a></li>

  </ul>

</div>

<input class="prev" type="button" value="向上" />

<input class="next" type="button" value="向下" />

</body>

</html>

<strong></strong>

Javascript:

$(function(){

    var Get_next_j=$('.box ul li');

      var Set_css_item={'display':'list-item','position':'relative','float':'left'};

    var Set_css_none={'display':'list-item','position':'absolute','float':'left'};

    var Set_time=2000;

    var i=0;

    Get_next_j.first().css(Set_css_item);

    $('.next').click(function(){

      if(!Get_next_j.eq(i).next().html())

      {

         Get_next_j.last().fadeOut(Set_time).css(Set_css_none);

         Get_next_j.first().fadeIn(Set_time).css(Set_css_item);

         i=0;

      }

      else{

       Get_next_j.eq(i).fadeOut(Set_time).css(Set_css_none);

       Get_next_j.eq(i).next().fadeIn(Set_time).css(Set_css_item);

       i=i+1;}

    });

    $('.prev').click(function(){

      if(i==0){

       Get_next_j.first().fadeOut(Set_time).css(Set_css_none);

       Get_next_j.last().fadeIn(Set_time).css(Set_css_item);

       Get_next_j.each(function(index,element){

         i=index;

       });

      }

      else{

       Get_next_j.eq(i).fadeOut(Set_time).css(Set_css_none);

       Get_next_j.eq(i).prev().fadeIn(Set_time).css(Set_css_item);

       i=i-1;}

    });

  });

juery

Juery 实现淡出 淡现效果

Juery 实现淡出淡现效果