הוסטס - פורום אחסון האתרים הגדול בישראל - בניית סליידר תמונות פשוט

אהלן
אני מנסה ליצור סליידר פשוט שמזהה כמה תמונות יש בתוך הDIV
וממספר אותם.
את החלק הזה כבר עשיתי.

קוד:

$("div#slider img").css("display","none");

        for(var i = 0;i<$("div#slider img").length;i++){

                $("div#slider img").eq(i).addClass(i.toString());

        }

        $("div#slider img:first-child").css("display","block");

        function slider(correct,from){

                console.log(correct);

                if($("div#slider img."+correct).css("display") == 'block'){

                        $("div#slider img."+(parseInt(correct)+1)).css("display","block");

                        $("div#slider img."+correct).css("display","none");

                }

        }

        setInterval(

                function(){

                        for(var i = 0;i<$("div#slider img").length;i++){

                                slider(i,$("div#slider img").length);

                        }

                }

        ,3000);

HTML קוד:

<div id="slider">

                                                        <img src="upload/1.png" />

                                                        <img src="upload/uniuqe.png" />

                                                        <img src="upload/pro2.png" />

                                        </div>

מה שבעקרון קורה כאן ספציפית בקוד זה שהוא מסיר את התמונה הראשונה מהעמוד.

עשיתי קוד בלולאת פור שרץ על כל התמונות, מסיר מה-i הקודם את ה display
ונותן ל i+1 display:block
עכשיו
ברגע שהוא מגיע לתמונה האחרונה אני לא מצליח לאפס את הI
כלומר

קוד:

if(i == $("div#slider img").length)

 i = 0;

הקוד כמובן בתחתית הFOR
זה פשוט תוקע את הדפדפן.

החלטתי לוותר על הלולאות והצלחתי לבצע את זה:

ציטוט:

$("div#slider img").css("display","none");
for(var i = 0;i<$("div#slider img").length;i++){
$("div#slider img").eq(i).addClass(i.toString());
}
$("div#slider img:first-child").addClass("selected");
setInterval(
function(){
if($("div#slider img.selected").is(':last-child')){
$("div#slider img.selected:last-child").removeClass("selected");
$("div#slider img:first-child").addClass("selected");
}else{
$("div#slider img.selected").next().addClass("selected2");
$("div#slider img.selected").removeClass("selected");
$("div#slider img.selected2").addClass("selected").removeClass(" selected2");
}
}
,3000);

עובד כמו שצריך !