Create auto playing and infinitely looping slideshows.

We're thrilled to unveil Slideshow Version 2.0, packed with new features and improvements that offer even more creative possibilities for your web designs. In this video, Benjamin walks us through the exciting updates, including the highly-requested drag support and a host of other tweaks. Let's dive right in!

Infinite Looping Auto-playing Slideshows

For those unfamiliar with Slideshow, it's a powerful component that allows web designers to create visually captivating, infinitely looping, and autoplaying slideshows with custom effects. In the previous version, inactive images had a lower opacity and were scaled down, adding a touch of elegance to your slideshows.

Introducing Drag Support

Now, with the release of Slideshow Version 2.0, we're thrilled to introduce drag support as a new feature. By harnessing the power of Framer motion, you can now make your slideshows draggable, adding a whole new level of interactivity to your designs. Updating your existing projects is a breeze — simply head to the assets panel, locate the slideshow component, and click on the update button. You'll notice a new draggable property that appears. Set it to 'yes,' and watch the magic happen!

Seamless Navigation through Swipes and Drags

Once the draggable feature is enabled, you'll notice a subtle, intuitive change upon previewing your slideshow. A handy little hand cursor appears, signaling the option to swipe and drag to navigate between images. Don't worry — the smooth transition settings you've defined in your properties will continue to be utilized, ensuring a seamless flow throughout your slideshows.

Custom Positioning of Arrows

In addition to drag support, Slideshow Version 2.0 brings forth several other exciting features. One common request from users has been the ability to control the position of the arrow controls in the slideshow. With the latest update, we're pleased to announce that you now have greater flexibility in this regard. While you could already upload custom images for the arrow controls, the new properties allow you to customize their behavior and positioning even further.

By setting the position to top right, for example, you can place the arrows exactly where you want them. You can even provide custom offsets, including negative values, to move the controls outside the slideshow's bounding box. This opens up a world of unique possibilities for creating captivating and innovative slideshow layouts.

Enhanced Visuals with Negative Offsets

But wait, there's more! Slideshow Version 2.0 also introduces the use of negative offsets for precise control over the position of dots below the slideshow. With this update, you can achieve a neat and aesthetically pleasing layout, aligning your dots flawlessly. Say goodbye to limitations and explore new creative avenues!

Velocity-based Dragging and Manual Positioning

The team at Framer listened to user feedback and ensured that dragging functionality in Slideshow Version 2.0 is responsive and intuitive. Your dragging velocity is taken into account, enabling quick and seamless swipes for effortless navigation. Need to manually move the slideshow to a specific item? No problem! Slideshow Version 2.0 considers your dragging offsets, ensuring accurate placement and preserving the desired flow in your design. You can even drag across multiple items at once for added convenience.