Search code examples
htmlcssslideshowvideo-gallery

CSS Slideshow Video Gallery

Does anyone know how to make a slideshow video gallery? I've been searching for this but all I could find was slideshow image galleries. If anyone knows anything to refer to for this can you please tell me?

This is how I want to make a video gallery in CSS enter image description here

Solution

  • You can use the snap scroll property of CSS to make this kind of Effect.

    here are some useful links to learn.

    https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Scroll_Snap

    https://css-tricks.com/practical-css-scroll-snapping/

    or you can use : scroll-direction: horizontal;

    https://css-tricks.com/pure-css-horizontal-scrolling/

    Or with some tricks and animation you can achieve it like this

    https://codepen.io/Schepp/pen/WNbQByE

    and last part which is to use videos that is quite easy, just replace the image or text with Video tags or youtube video iframe.

    That's it...