$(document).ready(function() {

count=$('.img_s').length;
num=0;
var timeid2;
var ww=-1003;

$("#main_slider").append('<div id="btn"><div id="btn_left"><img src="images/slide/btn_left.png"/></div><div id="btn_right"><img src="images/slide/btn_right.png"/></div></div>'); //왼쪽버튼 생성
$("#main_slider").append('<div id="imgbtn"><div id="imgbtn_1"><img src="images/slide/imgbtn1.png"/></div><div id="imgbtn_2"><img src="images/slide/imgbtn2.png"/></div><div id="imgbtn_3"><img src="images/slide/imgbtn3.png"/></div><div id="imgbtn_4"><img src="images/slide/imgbtn4.png"/></div></div>'); //왼쪽버튼 생성





function movie1(){
num=1;
$('.img_s:eq(0)').stop(true, true).fadeTo('slow',1, function() {

$(this).animate({top : 0,opacity:1}, {queue : false, duration : 1000}).animate({},{easing : 'easeInOutExpo'}, 500).animate({opacity:1}, 1000).animate({},{complete:function(){
$(this).append('<div id="img1_1"><img src="images/slide/1_1.png"/>"</div>');
$(this).append('<div id="img1_2"><img src="images/slide/1_2.png"/>"</div>');

$('#img1_1').stop(true, true).delay(1000).fadeTo('fast',0, function() {

$(this).animate({opacity:1,left:430},{duration:500,complete:function(){

$('#img1_2').stop(true, true).fadeTo('fast',0, function() {
$(this).animate({opacity:1,top:290},{duration:300,complete:function(){
$('.img_s').show();
}
});

});//img1_2 end

}
});
}); //#img1_1
}
});
});
}

function movie2(){
$('#btn_left').stop(true, true).fadeTo('fast',0, function() {
$(this).animate({opacity:1,marginLeft:40},{duration:500,complete:function(){
}
});
});
$('#btn_right').stop(true, true).fadeTo('fast',0, function() {
$(this).animate({opacity:1,marginLeft:940},{duration:500,complete:function(){
}
});
});
/*$('#imgbtn_1').stop(true, true).fadeTo('fast',0, function() {
$(this).animate({opacity:1,bottom:30},{duration:500,complete:function(){}
});
});
$('#imgbtn_2').stop(true, true).delay(50).fadeTo('fast',0, function() {
$(this).animate({opacity:1,bottom:30},{duration:500,complete:function(){}
});
});
$('#imgbtn_3').stop(true, true).delay(100).fadeTo('fast',0, function() {
$(this).animate({opacity:1,bottom:30},{duration:500,complete:function(){}
});
});
$('#imgbtn_4').stop(true, true).delay(150).fadeTo('fast',0, function() {
$(this).animate({opacity:1,bottom:30},{duration:500,complete:function(){}
});
});*/

};
function movie3(){
$(".img_s:eq(0)").animate({opacity:1,marginLeft:-1003},{duration:1000,complete:function(){}});

}


function movie4(){
num=2;
$('.img_s:eq(1)').stop(true, true).fadeTo('slow',1, function() {

$(this).animate({top : 0,opacity:0.5}, {queue : false, duration : 1000}).animate({},{easing : 'easeInOutExpo'}, 500).animate({opacity:1}, 1000).animate({},{complete:function(){
$(this).append('<div id="img2_1" style="top:225px;position:absolute;display:none; left:1470px;"><img src="images/slide/2_1.png"/>"</div>');
$(this).append('<div id="img2_2" style="top:270px;position:absolute;display:none; left:1470px;"><img src="images/slide/2_2.png"/>"</div>');

$('#img2_1').stop(true, true).fadeTo('fast',0, function() {

$(this).animate({opacity:1,left:1470},{duration:300,complete:function(){

$('#img2_2').stop(true, true).fadeTo('fast',0, function() {
$(this).animate({opacity:1,top:280},{duration:300,complete:function(){

}
});

});//img1_2 end

}
});
}); //#img1_1
}
});
});
}
function m_left(cnt){
$(".img_s:eq("+cnt+")").animate({opacity:1,marginLeft:0},{duration:1000,complete:function(){

}});
};
function m_right(cnt){
$(".img_s:eq("+cnt+")").animate({opacity:1,marginLeft:-1003},{duration:1000,complete:function(){


}});
};


cnttime = setTimeout(function() {
movie2();
}, 500);


/* $("#btn_left").hover(function(e) {
movepaly=false;
if(cnttime2) clearTimeout(cnttime2);
},function(e){
movepaly=true;
cnttime2 = setTimeout(cnttime2, 100);
});*/

$("#btn_left").click(function(e) {
if(cnttime1) clearTimeout(cnttime1);
if(cnttime4) clearTimeout(cnttime4);
if(num==2){
$("#img1_1").css({"top":"220px","display":"none","left":"450px"})
$("#img1_2").css({"top":"280px","display":"none","left":"440px"})
$("#img2_1").css({"top":"225px","display":"none","left":"1470px"})
$("#img2_2").css({"top":"270px","display":"none","left":"1470px"})
$('#imgul').animate({opacity:1,left:0},{duration:1000,complete:function(){num=1}});

cnttime1 = setTimeout(function() {
movie1();

}, 100);
}
else
{
num=1;
$("#img1_1").css({"top":"220px","display":"none","left":"450px"})
$("#img1_2").css({"top":"280px","display":"none","left":"440px"})
$("#img2_1").css({"top":"225px","display":"none","left":"1470px"})
$("#img2_2").css({"top":"270px","display":"none","left":"1470px"})
$('#imgul').animate({opacity:1,left:-1003},{duration:1000,complete:function(){num=2}});

cnttime3 = setTimeout(function() {
movie4();

}, 100);
}

});
$("#btn_right").click(function(e) {
if(cnttime1) clearTimeout(cnttime1);
if(cnttime4) clearTimeout(cnttime4);
if(num==1){
$("#img1_1").css({"top":"220px","display":"none","left":"450px"})
$("#img1_2").css({"top":"280px","display":"none","left":"440px"})
$("#img2_1").css({"top":"225px","display":"none","left":"1470px"})
$("#img2_2").css({"top":"270px","display":"none","left":"1470px"})
$('#imgul').animate({opacity:1,left:-1003},{duration:1000,complete:function(){num=2}});

cnttime3 = setTimeout(function() {
movie4();

}, 100);
}
else
{
num=2;
$("#img1_1").css({"top":"220px","display":"none","left":"450px"})
$("#img1_2").css({"top":"280px","display":"none","left":"440px"})
$("#img2_1").css({"top":"225px","display":"none","left":"1470px"})
$("#img2_2").css({"top":"270px","display":"none","left":"1470px"})
$('#imgul').animate({opacity:1,left:0},{duration:1000,complete:function(){num=1}});

cnttime1 = setTimeout(function() {
movie1();

}, 100);


}

});
autoslider();

function autoslider()
{

cnttime1 = setTimeout(function() {
movie1();

}, 500);
cnttime2 = setTimeout(function() {
$('#imgul').animate({opacity:1,left:ww},{duration:1000,complete:function(){}});

}, 6000);
cnttime3 = setTimeout(function() {
movie4();

}, 8000);

cnttime4 = setTimeout(function() {
$("#img1_1").css({"top":"220px","display":"none","left":"450px"})
$("#img1_2").css({"top":"280px","display":"none","left":"440px"})
$("#img2_1").css({"top":"225px","display":"none","left":"1470px"})
$("#img2_2").css({"top":"270px","display":"none","left":"1470px"})
$('#imgul').animate({opacity:1,left:0},{duration:1000,complete:function(){}});

}, 15000);
/* if(j==imgcnt){
j=0;
}*/
if(timeid2) clearTimeout(timeid2);
timeid2 = setTimeout(autoslider, 15000);


//var move=true;



}


}); //ready end

-----------------------------------------------------------------------------------------------

보신바와 같이 현재 2개의 이미지가 슬라이드중인 js 명령입니다

이미지를 점차 추가하여 슬라이드를 시키려고 하는데 여기서 어떻게 무얼 변경해야지

이미지가 추가적으로 슬라이드가 되는지 알고 싶습니다

누군가에겐 쉽고 간편할 수 있습니다 js에 무뇌한 질문자에게 질타 대신 멋진 답변 부탁드립니다

감사합니다!