2016-06-02 10 views
1

Iam이 현재 페이드 효과가있는 올빼미 회전 목마 2를 사용하려고했지만 기본 스 와이프 효과가 표시됩니다. 어떻게 해결할 수 있습니까? . '페이드 아웃'내가 animateIn을 추가 한올빼미 회전 목마 2 변색 효과가 작동하지 않음

animateIn: 'fadeIn', 
    nav:true, 





    loop: true, 
    responsive: { 
     0: { 
     items: 1 
     }, 
     600: { 
     items: 2 
     },  
     1000: { 
     items: 3, 
     slideBy:3, 
     } 
    } 
    }); 

: 'fadeIn 여기

는, 내 코드

function owlWrapperWidth(selector) { 
    $(selector).each(function(){ 
    $(this).find('.owl-carousel').outerWidth($(this).closest(selector).innerWidth()); 
    }); 
} 

owlWrapperWidth('.owl-wrapper'); 
$(window).resize(function() { 
    owlWrapperWidth($('.owl-wrapper')); 
}); 

$ ('. 올빼미 회전 목마 ') owlCarousel ({ animateOut이야 '하지만 모든

감사에서 더 성공

답변

2

올빼미 기능은 자장하게 "작동 애니메이션 없습니다 전자 항목 "회전 목마는 (한 번에 하나 개의 슬라이드 방송) :

". 기능을 하나 개의 항목으로 만 관점 속성을 지원하는 브라우저에서만 작동 애니메이션을 "

는 여기를 참조하십시오 여기에 http://owlcarousel2.github.io/OwlCarousel2/demos/animate.html

그에 따라 fadeIn과 fadeOut을 사용하는 현재의 슬라이더 구현 중 하나이며 모든 계정에서 코드가 코어 올빼미에 맞게 올바르게 표시됩니다.

$('.index-gallery .owlcarousel').owlCarousel({ 
    themeClass: 'owl-fullscreen owl-nonav white owl-loaded', 
    autoplay:true, 
    autoplayTimeout: 4000, 
    items:1, // items to display in slider 
    //margin:0, // margin(px) on item. 
    //LOOP? - IF ONLY ONE SLIDE SEE: https://github.com/smashingboxes/OwlCarousel2/issues/548 
    loop:true, // Inifnity loop. Duplicate last and first items to get loop illusion. 
    navRewind:true, // Go to first/last. 
    nav:true, // left and right arrows 
    autoHeight: true, 
    navContainerClass: 'owl-buttons', 
    dotsClass: 'owl-pagination', 
    dotClass: 'owl-page', 
    animateOut: 'fadeOut', 
    animateIn: 'fadeIn', 
    autoplayHoverPause:true, //false 
    lazyLoad: false, // IMG need special markup class="lazyOwl" and data-src="url_to_img" or/and data-src-retina="url_to_highres_img" 
    dots:false // true 
}); 
이 더 조언/솔루션/아이디어에 대한이 스레드를 참조하실 수 있습니다

:

Owl Carousel fade effect not working

+0

니스 Working.Thank의를 – mghhgm