fancyBox 3의 전환

Question

fancyBox 3에서 사용할 전환을 지정할 수 있습니까? 내가 관심이있는 3 전환 있습니다 슬라이드 사이

이동

1. 열기 슬라이드/갤러리
는
2. 기본적으로

닫기 슬라이드/갤러리, fancyBox 3 가지 종류의 서로 다른 전환을 사용 콘텐츠의 이 에서

<a href="img.jpg" data-fancybox><img src="thumb.jpg"></a> <!--This will zoom in--> 
<a data-fancybox href="#html-content">Open</a> <!--This will fade in--> 
<div id="html-content" style="display: none;"> 
    <p>This content does just fades in.</p> 
</div> 

봐 탐색 전환을 포함하여, 행동을 볼 수 있습니다. 이미지의 우리가 있습니다

1. 페이드
2. 슬라이드에서 수평
:
1. 확대
2. 슬라이드 수평
3. 줌 우리가 HTML 콘텐츠에 대한

아웃

3. 페이드 아웃

fancyBox 3에서이 기본 동작을 변경할 수 있습니까? 예를 들어 이미지를 페이드 인/페이드 아웃하려면? documentation에서 이에 대한 정보를 찾을 수 없었습니다.

Answer 1

fancyBox 버전 3.1.20에서이 옵션은 animationEffect 및 transitionEffect 옵션을 통해 가능합니다. 설명서 here을 찾을 수 있습니다.

Answer 2

내가이 권리를 얻는 지 확실하지 않지만 ... & 이미지를 (각 전환 사이에) 페이드 아웃하려면 약간의 CSS를 사용하여 속일 수 있습니다. jquery.fancybox에 추가하십시오. .CSS : 난 그냥 인간이야이는 산뜻한 솔루션이 아니라 일 :

// Animation duration in ms 
speed : 100 

면책 조항 :

.fancybox-slide.fancybox-slide--image { 
opacity: 0; 
-moz-transition: all 0.01s ease; 
-o-transition: all 0.01s ease; 
-webkit-transition: all 0.01s ease; 
transition: all 0.01s ease;} 

.fancybox-slide.fancybox-slide--image.fancybox-slide--complete { 
opacity: 1!important; 
-moz-transition: all 0.25s ease; 
-o-transition: all 0.25s ease; 
-webkit-transition: all 0.25s ease; 
transition: all 0.25s ease;} 

을 또한에 jquery.fancybox.js lib 디렉토리의 속도를 수정 나를 위해 (: