가로 스 와이프 슬라이드 쇼?

Question

최근에 나는 슬쩍 갤러리의 추세를보고 있었고 나는 그들을 구축하는 일반적인 방법이 무엇인지 궁금해하고 있었습니까? 슬릭 슬라이더가 스 와이프를 허용한다는 것을 알고 있지만,이 사이트 중 어느 것도 표준 슬라이드 쇼 플러그인을 사용하지 않는다고 확신합니다.

일부는 Canvas를 사용합니까? 그린 삭스? 아래 예 :

https://collagecrafting.com/

http://artempivovarov.com/photo-gallery

덕분에

Answer 1

그들은 또한 당신이 그것을 수행하는위한 최상의/가장 쉬운 방법 중 하나가 될 것이다, CSS 애니메이션을 사용하는 것으로 나타납니다. https://www.w3schools.com/css/css3_animations.asp

기본적으로 모든 작업은 위치를 변경하는 것입니다. 슬라이드 효과를 수행하는 애니메이션의 예가 다음과 같습니다.

.slideLeft { 
    position: absolute; 
    left: 25%; 
    animation-name: slideLeft; 
    animation-duration: 2s; 
} 
@keyframes slideLeft { 
    from { 
     left: 25%; 
    } 
    to { 
     left: 0%; 
    } 
}