슬라이드 무한 반복이요~

슬라이드 무한 반복이요~

QA

슬라이드 무한 반복이요~

본문

슬라이드가 계속 반복되게 할려면 무얼 추가해야하나요??

이 사이트에 계속 머물러 있으면 움직이고 머무르지 않으면 (듀얼이에요) 멈춰버려요~

 

 


/* 
 * custom js Document
*/ 
$(window).load(function(){
    
});
$(document).ready(function() {
    responsive();    
    visualAni();
    subCheck();    
    smoothScroll();
    //scrollHeader();
    lnbScroll();
    btnSelect();
    basicSel();
    swiper();
    defaultJs();
});

//browser check
$(function(){
    //ie check
    var agent = navigator.userAgent.toLowerCase();
    if (agent.indexOf("msie") > -1 || agent.indexOf("trident") > -1) {
          $('body').addClass('ie');
    } else if ( agent.search( "edge/" ) > -1 ){
        $('body').addClass('ie_edge');
    } else {
        //나머지브라우저 컨트롤
    }
});

//responsive style
function responsive(){
    
}

function visualTxt(){
    //visual ani
    var gloStrong = $(".animation-time-text.on");
    var test = gloStrong.text();
    test = test.split("");
    gloStrong.empty();        
    for(i = 0; i < test.length; i++) {
        gloStrong.append("<i class='split" + i + "'>" + test[i] + "</i>");        
        gloStrong.children("i").eq(i).css('animation-delay', i + '00ms');
    }    
}
//visual slider animation
function visualAni(){
    $('.area_visual .list li').eq(0).addClass("active-slide").find("strong").addClass("on");
    visualTxt();
    $('.area_visual .list').bxSlider({
        mode:'fade',
        fade: true,
        auto:true,
        pager:true,
        controls:false,
        pause:3000,
        speed:1000,
        onSlideBefore:function(currentIndex){
            $('.area_visual .list li').children().eq(currentIndex).addClass('active-slide');
            $('.area_visual .list li strong').addClass("on");    
        },
        onSlideBefore: function($slideElement, oldIndex, newIndex){
            $('.area_visual .list li').removeClass('active-slide');
            $('.area_visual .list li strong').removeClass("on");
            $slideElement.find("strong").addClass("on");
            $slideElement.addClass('active-slide');
            visualTxt();
        }
    });    
    
    $(".scroll_down").click(function(event){            
        event.preventDefault();
        $('html,body').animate({scrollTop:$(this.hash).offset().top}, 700);
    });
}
//sub style
function subCheck(){
    if ($("#wrap").children().is(".area_visual") || $("#wrap").children().is(".intro")) {
      $('body').addClass('main');
    }
    else{
         $('body').addClass('sub');
    }
}
//scroll custom
$(window).scroll( function(){
    $('.ani, .slideRight, .slideUp, .slidedown, .slideLeft').each( function(i){
        
        var bottom_of_object = $(this).offset().top + $(this).outerHeight()/3;
        var bottom_of_window = $(window).scrollTop() + $(window).height();
        
        if( bottom_of_window > bottom_of_object ){                
            $(this).addClass("is-animate");                        
        }
        else{
            //$(this).removeClass('is-animate');
        }        
    });     
});    
//scroll down
$(function() {
    $('.scrolldown').click (function() {
          $('html, body').animate({scrollTop: $('#content').offset().top }, 'slow');
          return false;
    });
});
//scroll top bottom
$(window).on('scroll', function() {
    
    if ($(window).scrollTop() < $(document).height() - $(window).height() - $('#footer').outerHeight() + 110) {
    $('.btn_top').addClass('active');
    } else {
        $('.btn_top').removeClass('active');
    }
    
    if ($(window).scrollTop() >= 500) {
        $('.btn_top').addClass('fiexd');
    }
    else {
        $('.btn_top').removeClass('fiexd');
    }
    var poTop = $("#footer").outerHeight();    
    if ($(window).scrollTop() < $(document).height() - $(window).height() - $('#footer').outerHeight()) {
        $('#footer, .fix_check').removeClass('stop');        
        //$('.fix_check').css({"bottom":"auto"});
    } else {
        $('#footer, .fix_check').addClass('stop');
        //$('.fix_check').css({"bottom":poTop});
        //alert(poTop);
    }
});
//smooth scroll
function is_mob(){
    return (/Android|iPhone|iPad|iPod|BlackBerry|Windows Phone/i).test(navigator.userAgent || navigator.vendor || window.opera);
}
function is_mac(){
    return navigator.platform.indexOf('Mac') > -1;
}
function is_chrome(){
    return /Chrome/.test(navigator.userAgent);
}
function is_firefox(){
    return /Firefox/.test(navigator.userAgent);
}
function smoothScroll(){
    if(is_mob() || is_mac() || is_firefox()) return;
    var $window = $(window);
    if(smoothScroll_passive()){
        window.addEventListener("wheel",smoothScroll_scrolling,{passive: false});
    }else{
        $window.on("mousewheel DOMMouseScroll", smoothScroll_scrolling);
    }                
}
function smoothScroll_passive(){
    var supportsPassive = false;
    try {document.addEventListener("test", null, { get passive() { supportsPassive = true }});
    } catch(e) {}
    return supportsPassive;
}
function smoothScroll_scrolling(event){
    if(!event.path){
        event.path = new Array();
        function callParentNode(child){
            if(child.parentNode){
                event.path.push(child.parentNode);
                callParentNode(child.parentNode);
            }
            return;
        }
        event.path.push(event.target);
        callParentNode(event.target);
    }
    //스크롤이 일어나면 안되는 위치태그의 id를 넣어주세요
    var impossibility = new Array("non_scroll", "fix_ch");
    for(var i=0; event.path.length > i; i++){
        for(var j=0; impossibility.length > j; j++){
            if(event.path[i].getAttribute && event.path[i].getAttribute("id") ==impossibility[j])return;
        }
    }
    event.preventDefault();
    var $window = $(window);
    var scrollTime = 1;
    var distance_offset = 2.5;
    var scrollDistance = $window.height() / distance_offset;
    var delta = 0;
    if(smoothScroll_passive()){
        delta = event.wheelDelta/120 || -event.originalEvent.detail/3;
    }else{
        if(typeof event.originalEvent.deltaY != "undefined"){
            delta = -event.originalEvent.deltaY/120;
        }else{
            delta = event.originalEvent.wheelDelta/120 || -event.originalEvent.detail/3;
        }
    }
    var scrollTop = $window.scrollTop();
    var finalScroll = scrollTop - parseInt(delta*scrollDistance);
    TweenMax.to($window, scrollTime, {
        scrollTo : { y: finalScroll, autoKill:true },
        ease: Power3.easeOut,
        overwrite: 5
    });        
    
}
 

 

 

이 질문에 댓글 쓰기 :

답변 1

이것을 적용하고, 분석해서 수정까지 하기에는 너무 힘든것 같습니다.

 

코드가 한눈에 딱 들어와서 알려 주었으면 좋았을 텐데..

 

하지만 검색을 해보니 https://blogpack.tistory.com/1120  이런 것이 있으니,  참조하세요.

 

그리고 swiper.js 에 옵션도 있읍니다. https://solbel.tistory.com/187

답변을 작성하시기 전에 로그인 해주세요.
전체 0 | RSS
QA 내용 검색
  • 개별 목록 구성 제목 답변작성자조회작성일
  • 질문이 없습니다.

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT