Advanced slideshow with one page divided in 6x4, press to view more info

42 Views Asked by At

I want to create a slideshow with this aspect:

https://i.stack.imgur.com/f7JfI.png

One of the pages of the slideshow should be divided in 6 squares per line, there are 4 lines, each square is clickable and should trigger a animation like the one that is on the image when the mouse hovers on one square.

There are guides and etc for slideshows, but not for this i want to make, i didnt find any.

Help is highly appreciated.

1

There are 1 best solutions below

3
On

Without seeing your code, it's a bit difficult to help. However, I found two resources which may be able to help you. They explain how to build slideshows with JavaScript and CSS. From there, you can build each slide individually and add the properties you want through a simple table that takes advantage of animation.

This resource shows you how to build each slide from the ground up in a nice way. This one in merely source code on a fancy, animated slideshow, but certainly interesting and the code may shed some light on your own problem.

I hope that helps!