Slideshow issue

Design help General
1

Hi!

Im having a litlle trouble to make my slideshow transitions working. My client wants to make This kind of Animation or similar on the slideshow when it passes from one slide to another. Here is the link: www.kirkland.com.

The first slide we see works, but the Next One doesnt work. I really tried everything i know, i need your help please.

The link of my site: https://preview.webflow.com/preview/nbr-advogados?utm_medium=preview_link&utm_source=designer&utm_content=nbr-advogados&preview=3b893adee25261a69f49d0f369db3847&mode=preview

Thanks

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

Hi @Helena, thanks for reaching out. You might apply a slide animation using the slide in, slide out triggers, see Triggers and animations | Webflow University

For slider interactions - Select a Slide element inside of the Mask element, then choose Slider from the element trigger menu.

3

Hello @cyberdave , thanks for your quick reply.

I already did this, and it works on slide1 i got the effect tha i want but on slide2 doesn’t work.
It is doing the “zoom” animation on the slide2 but it is doing in the right side of the page and i dont understand why.
Can you check out my link to see what i’m doing wrong?

https://preview.webflow.com/preview/nbr-advogados?utm_medium=preview_link&utm_source=designer&utm_content=nbr-advogados&preview=3b893adee25261a69f49d0f369db3847&mode=preview

Thank you so much

4

I checked your read only links and the both two slides are working. Can you explain what are you trying to achieve

https://www.loom.com/share/ca7ad8ceb8ba40eb85ffd1f8588fe8a1

5

Hello @shokoaviv

I made a video to exemplify what is my issue.
Slide 1 is ok (as you can see there is a Zoom in animation in the image.
But when we go to slide 2, the slide actually is doing the Zoom animation but the slide is not fitting the screen, is located on the right side of the screen, as you can see on the video.)
Any ideia why the slide 2 is not fitting the screen and it still fixed on the right side?
com-video-to-gif%20(3)
Thank you so much

6

Can you plz resend here the read only link?

7

@shokoaviv

There you have: https://preview.webflow.com/preview/nbr-advogados?utm_medium=preview_link&utm_source=designer&utm_content=nbr-advogados&preview=3b893adee25261a69f49d0f369db3847&mode=preview

Thank you so much for your help!

8

I’ll dive unto it tomorrow :slight_smile:

got to go

9

Hi @Helena, I think the trouble is happening because the scaling operation is happening on the slide element itself, for best results the slide animation should be applied to content within the slide, not the slide itself.

I have made a video to help show how to create this design for the slider: Screen Recording 2019-10-22...

I hope this helps

1 Like
10

@cyberdave the link is broken :slight_smile:

Anyway I think you right. I placed the images inside each slide as A div with background image and it works for me.

See how I placed the images:
27%20AM

11

Hi @shokoaviv, the link is working for me, can you show what message you are receiving? This might be due to amazon issues: Screen Recording 2019-10-22...

12

@cyberdave it is working now. the message was sorting like " safari can’t open… "

13

Hi @shokoaviv, Cloudapp I believe uses the same Amazon cdn we do, so that could have been the issue. Glad it worked.

14

Hello @cyberdave and @shokoaviv
Thank you so much, I will try this now on my project to see if it works now.
I will tell my feedback soon.

thanks again for your support, you’re awesome guys

15

@cyberdave and @shokoaviv it works perfectly!
Thanks a lot!

16

Hi there again! Im having trouble again with my slideshow.
I noticed a slight blur in the images as the slide shifts from one to the other. Is there any way to fiz this or its justs the animation itself? Auto slide playback also stopped working after adding slide show transitions.
Can you help me please?

Thanks a lot

17

@cyberdave @shokoaviv Can you help me please?
Thanks!

18

Hi Helena

I will try to do my best to help you, first let me know if the Read Only Link still relevant - if not, please share again :slight_smile:

19

Checked again - don’t see any blur and auto playback is working fine on My side :slight_smile:

20

Hello @shokoaviv

Sorry maybe i didnt explain it correctly.
I made a video to explain to you.
When the page loads the auto play is working perfectly.
Since the moment we press the bullets to change the slide, the auto play stops working.
About the image , you can see is not a blur, but a litle of shaking in the background image when its making the zoom in (I pointed the cursor to the place of the image you can see this easily).
My client pointed this problem, to be honest, i didnt realize this until he pointed me this issue.

Here is the video i made:
shorturl.at/uDFP0

Thankss!!