2012-10-31 4 views
0

이 코드를 작동시키려는 약간의 문제가 있습니다. 웬일인지 무엇이 잘못되었는지를 알 수없는 것 같습니다. 누군가 내가 약 3 초 동안 슬라이드를 보여줄 수있는 것을 알고 있다면, 페이드 아웃하고 새로운 것을 보여 주며 끝에서 첫 번째 루프로 돌아가서 멋질 것입니다! 아래에 지금 당장 가지고있는 코드를 게시했습니다. 나는이 프로젝트가 2 주 만에 만기가 될 것이므로 많은 도움이 필요하다. 감사 할 일이 많이있다.Jquery 내용 슬라이더 문제

<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/

+0

는 여기에 무슨 일이 일어나고 있는지 모른다. 브라우저의 콘솔을 확인하십시오. 많은 곳에서 구문 오류가 있습니다. 하나를 고치면 다른 것을 얻습니다. 당신이 실제로하고 싶은 일에 맞는 구문을 사용하고 있는지 확신하지 못합니다. – Ian

답변

1

귀하의 함수 선언이 올바르지 않습니다. 아마도 다음을 시도하고 있습니다.

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

어쨌든 JS 범위 및 폐쇄에 대해 읽으십시오.

Article 1Article 2

관련 문제