这里是演示地址:http://www.68design.net/download/ad/68design2009042/index.html代码下载:
http://www.68design.net/download/ad/68design2009042.rar想修改下面这个幻灯效果是自动切换的,如何修改这个部分,变成自动呢?主要修改是这里 ,初始var i=0 载入时候是第一张图片,初始var i=1 载入时候是第二张图片,点击自动切换如何通过 设置timer = null;和var offset = 5000;来变换初始值,而成自动切换效果呢, //初始第一张图片
var i =0;

show(); function show(){
if (i==$("li img").size()) i = 0 
$("li img").eq(i).click();
i++; //setTimeout(show(),1000);
代码贴如下:<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Copyright" content="John Resig (jquery.com)" />
<meta name="keywords" content="JS代码,焦点图,JS广告代码,JS特效代码" />
<meta name="description" content="此代码内容为jQuery缩略图广告效果,属于站长常用代码。" />
<title>jQuery缩略图广告效果</title>
<link href="css/css.css" rel="stylesheet" type="text/css">
<script src="js/jquery-1[1].2.1.pack.js" type="text/javascript"></script>
</head>
<body>
<br/><br/>
<div align="center">
<!-- 焦点图切换开始 --><DIV id=nav>
<UL>
  <LI><IMG src="images/01.jpg" text="春风&大地|春华秋实" pic="1">
  <DIV>一片麦穗</DIV></LI>
  <LI><IMG src="images/02.jpg" text="美景如画的海景|天蓝海蓝" pic="2">
  <DIV>一个海岛</DIV></LI>
  <LI><IMG src="images/03.jpg" text="郁郁葱葱的生命|生生不息的生命" pic="3">
  <DIV>一树绿叶</DIV></LI>
  <LI><IMG src="images/04.jpg" text="孤独的一棵老树|等谁呢?" pic="4">
  <DIV>一棵大树</DIV></LI>
  <LI><IMG src="images/05.jpg" text="明媚的向日葵花|生生不息的生命" pic="5">
  <DIV>一地葵花</DIV></LI>
</UL>
<DIV id=frontTextBack></DIV>
<DIV id=frontText></DIV>
<DIV id=frontTextSub></DIV>
<DIV id=BG></DIV>
<DIV id=mask></DIV>
<DIV id=back><IMG height=240 src="" width=760>
</DIV>
</DIV><p><SCRIPT type=text/javascript>
 <!--
 var num = 0;
 $("#nav").hide();
$("li img").load(function(){
num++;
if (num==4)
{
$("#nav").show();
}
})

.click(function(){

//如果已经处于active状态,return
if (this.className.indexOf("active")!=-1) return;

//正文文字渐隐
$("#frontText").fadeOut();
$("#frontTextBack").fadeOut();
$("#frontTextSub").fadeOut(); //active状态的图片恢复原样
$("li img.active").fadeTo(200,0.6)
.removeClass("active")
.animate({top:5,width:52,left:10},300)
.parent().css({"color":"#aaa"});  //

//获取数据
var i = $(this).attr("pic");
var t = $(this).attr("text").split("|");

//当前
$(this).animate({top:-5,width:70,height:40,left:1},100)
.addClass("active")
.fadeTo(200,1)

.parent().css({"color":"white"}); $("#back").children().addClass("gray").end()
.fadeTo(800,0.1,function(){
//var IMG = new Image();
//IMG.s
$(this).children("img").attr("src","images/"+i+".jpg").removeClass("gray");   //更改图片
$(this).fadeTo(500,1,function(){
$("#frontText").html(t[0]).fadeIn(200); //更改正文文字
$("#frontTextBack").html(t[0]).fadeIn(200); //阴影文字
$("#frontTextSub").html(t[1]).fadeIn(200)} //副标题
);
})
})

//初始第一张图片
var i =2;
var timer = null;
    var offset = 5000;

show(); function show(){
if (i==$("li img").size()) i = 0 
$("li img").eq(i).click();
i++; //setTimeout(show(),1000); }
document.oncontextmenu   =  function(e){return false}

if (self.location.search!=""){
var V = self.location.search;
V = V.substr(1,V.length);
eval(V);
var json ="{";
if (option.skin==0)
$("#mask").hide();
if (option.animate == 0){
$("#nav ul").hide();
}
$("#nav").width(option.width?option.width:760);
$("#nav").height(option.height?option.height:240);
$("#back img").width($("#nav").width());
$("#back img").height($("#nav").height());
$(self.parent.document.getElementById("splash")).children().height($("#nav").height()).width($("#nav").width());
}

 //-->
 </SCRIPT>
  <!-- 焦点图切换结束 -->
  <br/>
  <br/>
</p>
</div></body>
</html>

解决方案 »

  1.   

    Jquery的写法我不会,只是照着普通的js调用方法改了下我试验是可以的
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <meta name="Copyright" content="John Resig (jquery.com)" />
    <meta name="keywords" content="JS代码,焦点图,JS广告代码,JS特效代码" />
    <meta name="description" content="此代码内容为jQuery缩略图广告效果,属于站长常用代码。" />
    <title>jQuery缩略图广告效果</title>
    <link href="css/css.css" rel="stylesheet" type="text/css">
    <script src="js/jquery-1[1].2.1.pack.js" type="text/javascript"></script>
    </head>
    <body onload='ds()'>
    <br/><br/>
    <div align="center">
    <!-- 焦点图切换开始 --><DIV id=nav>
    <UL>
      <LI><IMG src="images/01.jpg" text="春风&大地|春华秋实" pic="1">
      <DIV>一片麦穗</DIV></LI>
      <LI><IMG src="images/02.jpg" text="美景如画的海景|天蓝海蓝" pic="2">
      <DIV>一个海岛</DIV></LI>
      <LI><IMG src="images/03.jpg" text="郁郁葱葱的生命|生生不息的生命" pic="3">
      <DIV>一树绿叶</DIV></LI>
      <LI><IMG src="images/04.jpg" text="孤独的一棵老树|等谁呢?" pic="4">
      <DIV>一棵大树</DIV></LI>
      <LI><IMG src="images/05.jpg" text="明媚的向日葵花|生生不息的生命" pic="5">
      <DIV>一地葵花</DIV></LI>
    </UL>
    <DIV id=frontTextBack></DIV>
    <DIV id=frontText></DIV>
    <DIV id=frontTextSub></DIV>
    <DIV id=BG></DIV>
    <DIV id=mask></DIV>
    <DIV id=back><IMG height=240 src="" width=760></DIV>
    </DIV><p>
      <SCRIPT type=text/javascript>  function ds(){
     
       setInterval(show,3000);  //就这一句
     

      }
     <!--
     var num = 0;
     $("#nav").hide();
    $("li img").load(function(){
    num++;
    if (num==4)
    {
    $("#nav").show();
    }
    })
    .click(function(){

    //如果已经处于active状态,return
    if (this.className.indexOf("active")!=-1) return;

    //正文文字渐隐
    $("#frontText").fadeOut();
    $("#frontTextBack").fadeOut();
    $("#frontTextSub").fadeOut(); //active状态的图片恢复原样
    $("li img.active").fadeTo(200,0.6)
    .removeClass("active")
    .animate({top:5,width:52,left:10},300)
    .parent().css({"color":"#aaa"});  //

    //获取数据
    var i = $(this).attr("pic");
    var t = $(this).attr("text").split("|");

    //当前
    $(this).animate({top:-5,width:70,height:40,left:1},100)
    .addClass("active")
    .fadeTo(200,1)
    .parent().css({"color":"white"}); $("#back").children().addClass("gray").end()
    .fadeTo(500,0.1,function(){
    //var IMG = new Image();
    //IMG.s
    $(this).children("img").attr("src","images/"+i+".jpg").removeClass("gray");   //更改图片
    $(this).fadeTo(500,1,function(){
    $("#frontText").html(t[0]).fadeIn(200); //更改正文文字
    $("#frontTextBack").html(t[0]).fadeIn(200); //阴影文字
    $("#frontTextSub").html(t[1]).fadeIn(200)} //副标题
    );
    })
    }) //初始第一张图片

    var i =0; show(); function show(){
    if (i==$("li img").size()) i = 0
    $("li img").eq(i).click();
    i++;
    //setTimeout(show(),1000);

    }

    document.oncontextmenu   =  function(e){return false}

    if (self.location.search!=""){
    var V = self.location.search;
    V = V.substr(1,V.length);
    eval(V);
    var json ="{";
    if (option.skin==0)
    $("#mask").hide();
    if (option.animate == 0){
    $("#nav ul").hide();
    }
    $("#nav").width(option.width?option.width:760);
    $("#nav").height(option.height?option.height:240);
    $("#back img").width($("#nav").width());
    $("#back img").height($("#nav").height());
    $(self.parent.document.getElementById("splash")).children().height($("#nav").height()).width($("#nav").width());
    }

     //-->
     </SCRIPT>
      <!-- 焦点图切换结束 -->
      <br/>
      <br/>
    </p>
    </div></body>
    </html>
      

  2.   

    onload='ds()'//onload 注册 执行定时 
    setInterval(show,3000);  //3000毫秒执行一次