Slider Showing Blank slides at end

Hi,

I have created a slider in a collection with a standard six slides. The issue I’m having is that some pages have 5 images in the slide, and the others have 6. When there are only 5 images in a slider I want to delete the last slide so it does not show up blank. Anyone have any ideas?

Thanks!

Abbie

@bart Hi! I’m having exatly the same problem here. I’m getting the pictures of a CMS. And I manage to avoing showing 4 blanks but there always a last stubborn with slide at the end. How could I get rid of it?

https://preview.webflow.com/preview/castelestudio?utm_medium=preview_link&utm_source=designer&utm_content=castelestudio&preview=310d9ddef9bb877a5681730e7c079e4f&pageId=5d3ef9454401a535deef637d&itemId=5d3efde74401a57b43ef7758&mode=preview

It happens in every project details on works.

Add live URL (By custom code thier is option to remove empty divs).

@Siton_Systems https://castelestudio.webflow.io/works/bershka-soho

@bart @Siton_Systems the problem is in the math CSS code of the slider “transform: translateX(-1737.89px); opacity: 1; transition: transform 500ms ease 0s;” it’s a bug of @WebflowMasterclass

As if we remove the invisible element the problem persist.

document.getElementsByClassName(“slide w-condition-invisible w-slide”)[0].parentNode.removeChild( document.getElementsByClassName(“slide w-condition-invisible w-slide”)[0] )

Hi every one, @studiopowell solved it.

before body tag

1 Like

Thank you for posting this @Pablo_Ledo. I entered this code before the body tag and added the conditions for visibility on the slides themselves. I am doing something wrong? It still isn’t working. It is still showing a grey / blank slide at the last slide.
Here is my preview link. https://preview.webflow.com/preview/our-home-sarnia-inc?utm_medium=preview_link&utm_source=designer&utm_content=our-home-sarnia-inc&preview=15d8373da6ea243fb64d90d56faf28cd&pageId=5e0306d488c99e4b87b619da&mode=preview

Please help, thank you!

I tried this but cannot get it to work. Do you have an example of the implementation?

This doesn’t work for me either - is there an update??

Hi,

I found a workaround within Webflow. @AbbieNorris Your slider has up to 6 slides pulling from CMS. And you need to display 5 images. When you upload your images to the CMS put the 5th image on the 6th CMS image field. Leave the 5th empty. Then set the visibility for each slide based on if the image is set via CMS or not. It worked for me on this website I’ve made:
https://www.knukimphoto.com/work/sportivo-sunday-edit

This project has 12 pics total. But the CMS has 20 image fields.

Let me know if that does the trick. I also stumbled upon this solution, but I haven’t tried it yet.

Cheers

1 Like

This is amazing! And no custom code required, brilliant.