var MainPic = {
    
        imgs: null,
        
        idx: 0,
        
        delayTime : 5000,
        
        fadingTime : 400,
        
        interval : null,
        
        init : function(){
                
                //목록이미지 배열객체
                MainPic.imgs = document.getElementById("main_imgs").getElementsByTagName("img");
                MainPic.a = document.getElementById("main_imgs").getElementsByTagName("a");
                
                //보여질이미지 설정(랜덤)
                MainPic.idx = Math.floor(Math.random()*MainPic.imgs.length);
                

                
                //이미지초기화
                $("#main_skin_banner>p").css("background-image","url("+MainPic.imgs[MainPic.idx].src+")");
                //링크 초기화
                $("#main_skin_banner>p>a").attr("href", MainPic.a[MainPic.idx].href);

                if( $(MainPic.a[MainPic.idx]).attr("target") == "_blank"){
                    $("#main_skin_banner>p>a").attr("target", "_blank");
                }else{
                    $("#main_skin_banner>p>a").attr("target", "");
                }
                

                //MainPic.fading();
                
                
                //자동 슬라이드쇼 시작
                MainPic.looping(1);

                //버튼작동 이벤트핸들러
                $("#btn_prev").on("click", function(){ MainPic.going(-1);return false;});
                $("#btn_next").on("click", function(){ MainPic.going(1);return false;});

                //버튼롤로버시 롤링 정지,실행 이벤트핸들러
                $("#btn_area img").hover(
                    function(){MainPic.looping();},
                    function(){MainPic.looping(1);}
                );

            },
            
        looping : function(mode){

            if(mode && !MainPic.interval){
            
                MainPic.interval = setInterval(function(){
                        //다음 이미지 설정
                        MainPic.idx++;
                        if(MainPic.idx >= MainPic.imgs.length) MainPic.idx = 0;
                        MainPic.fading();
                    
                    },MainPic.delayTime);    
                
            }else{
                clearInterval(MainPic.interval);
                MainPic.interval = null;
            }
            
        },

        going : function(sum){

            MainPic.idx += sum;
            if(MainPic.idx >= MainPic.imgs.length) MainPic.idx = 0;
            if(MainPic.idx < 0 ) MainPic.idx = MainPic.imgs.length-1;
            MainPic.fading();
            
        },
            
        fading : function(){
            
            //디졸브효과
            /*$("#main_skin_banner>p").css("background-image","url("+MainPic.imgs[MainPic.idx].src+")").fadeIn(MainPic.fadingTime,function(){
                    $("#main_skin_banner").css("background-image","url("+MainPic.imgs[MainPic.idx].src+")");
                    $(this).hide();
                });*/
                
            //페이드 인, 아웃
            $("#main_skin_banner>p").fadeOut(MainPic.fadingTime,function(){
                    //이미지 변경
                    $("#main_skin_banner>p").css("background-image","url("+MainPic.imgs[MainPic.idx].src+")").fadeIn(MainPic.fadingTime/2,function(){
                        //링크 변경
                        $("#main_skin_banner>p>a").attr("href", MainPic.a[MainPic.idx].href);

                        if( $(MainPic.a[MainPic.idx]).attr("target") == "_blank"){
                            $("#main_skin_banner>p>a").attr("target", "_blank");
                        }else{
                            $("#main_skin_banner>p>a").attr("target", "");
                        }
                    });
                    
            });
                
        }
    }

 

 

------------------------------ HTML ------------------------------

 

 

<div id="main_skin_banner"><p><a href="#" style="display:block; width:900px; height:100%; margin:0 auto;"><!--뷰이미지--></a></p>
      
      <ul id="main_imgs">
        <li><a href="/home/biz_dvd_list.asp?menuArea=ma1_2" target="_blank"><img src="../images/main/banner/main_banner2014_01.jpg" alt="" /></a></li>
        <li><a href="/board/list.asp?board=takeon&menuArea=ma2_3"><img src="../images/main/banner/main_banner2014_02.jpg" alt="" /></a></li>
        <li><a href="/goods/content.asp?guid=655715"><img src="../images/main/banner/main_banner2014_03.jpg" alt="" /></a></li>
       </ul>
       
         <div id="btn_area">
           <ul>
             <li id="btn_prev"><img src="../images/main/banner/btn_main_banner_prev_out.png" alt="이전으로 가기" class="roll_img"/></li>
             <li id="btn_next"><img src="../images/main/banner/btn_main_banner_next_out.png" alt="다음으로 가기" class="roll_img"/></li>
           </ul>
      </div>
    </div><!--main_skin_banner//-->

 

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