0

我在尝试使此代码正常工作时遇到了一些问题，由于某种原因，我似乎无法找到问题所在。如果有人知道我可以做些什么来让它显示一张幻灯片大约 3 秒，然后淡出并显示一个新的，最后回到第一个并循环，那就太好了！下面我发布了我现在拥有的代码。我真的需要一些帮助，因为这个项目将在 2 周内到期，我还有很多工作要做，谢谢！

    <section class="clearfix">
    <div id="snapshots">
        <article>
            <img src="http://static.tumblr.com/dbek3sy/4mem1qr1m/themes_image.png">
        </article>
        <article>
            <img src="http://static.tumblr.com/dbek3sy/q8Em247a0/slidehome_4.png">
        </article>
        <article>
            <img src="http://static.tumblr.com/dbek3sy/dsLm2trr5/slidehome_5.png">
        </article>
    </div>
    </section>​


    /* joey content slider function */
    window.onload = function() { 

    var time = 1500;
    var content = $('#snapshots');
    var cont = 1;


    // MARK THE ARTICLES AND CONTENT
    $(function article(){

    // how many slides 
    // an = article number
    var an = content.find("article").length;

    // define the amount of slides in a class name 
    // example: <div class="slides_6">
    content.addClass("slides_"+an);

    // slide switcher 
    content.append('<div id="switch"></div>');

    };




// FIND AND MARK SLIDES
$(function slides() {
    numb = 1;
    content.find("article").each(function(){
        $(this).addClass("slide_"+numb);
        numb++;
        $(this).hide();
    });

    //setTimeout("", 4000);
}


function slider(content, time){
    content.fadeOut(time, function() {

    // plus 1 slide 
    var conta = cont+1;

    $("article.slide_"+conta).animate({
        "display": "block"
    },1500);

    $("article.slide_"+cont).animate({
        "display": "none"
    },1500);

    setTimeout("doitdude()", 4000);

    });

}


// RESET SLIDE
function reset(content, time) {

    // fade out content 
    content.fadeOut(time, function(){

    // while fading out 

    // show first slide 
    $("article.slide_1").animate({
        "display": "block"
    },1500);
     // hide the last one 
    $("article.slide_"+conta).animate({
        "display": "none"
    },1500);

    // end transition
    });


    setTimeout("doitdude()", 4000);
}


function doitdude() {
    if(cont < an) {
        slider(content, 1000);
        cont++;
    }
    else{
        var conta = cont;
        var cont = 1;
        // reset code here:
        reset()
    }


};​


    #snapshots { overflow: hidden; height: 410px; width: auto; }
    #snapshots img { }​

注意：我不能使用插件，因为我正在尝试自己制作。谢谢！

这里还有一个 JsFiddle：

http://jsfiddle.net/UYE4E/

4

1 回答 1

1

您的函数声明不正确。可能您正在尝试执行以下操作：

(function($) {
    function foo(){
        //foo body
    };
}(jQuery) );

无论如何，请阅读 JS 作用域和闭包。

第 1 条 第 2 条

于 2012-10-31T21:37:52.547 回答