I am needing some help here in creating a auto sliding image thumbnail gallery.
I have created a thumbnail gallery already … following example 2 found this is webflow page http://tabs.webflow.io/.
Anyhow I am stuck on the auto playing part. I want to create the effect similar to the one of a slider. Does anyone have any idea on how to accomplish this.
Unfortunately there is no such feature yet in Webflow. But I can show you some work-around with slider, if you have not too many pictures in the gallery.
Yea, I think if I used jquery I would have to export the code and edit right?. This way I won’t be able to view in the preview. Wish I could, Webflow isn’t that advance yet … or technology itself.
I wish webflow could add auto play tabs!!
I guess I would just use the workaround for now and after all is done in the browser, export and edit the code for self - hosting.
How might I do so with jquery … have you had a solution before?
There are quiet a few examples there as well… take a look.
I liked it because it
has a ton of transitions
has the ability to jump directly to an image
and autoloads
and allows “folders”
and is touch friendly
responsive
The original jquery code is actually quite small.
When I came across the (fully docucmented) code… I added 12 images which took the line count to about 350. Each images requires 4 lines. (open div / close div / image / thumb)… so 48 lines for the images… which means the actual code is about 300 lines or so (I use lot of line spacing… and as I said… the code is documented).
The code itself contains all the transitions… even if you don’t use them… so I went in and removed all the unneeded transition code (transitions that I didn’t want / need) and all the documentation (since I already knew what the code does).
I rewrote a couple sections… resulting in (with 12 images)… 110 lines of code. That’s tiny. Very fast to load.
If you rip it apart… you have to be careful with the transition code - as there is quite a bit of math going in there.