Background slideshow
With Makeswift's carousel component, you can quickly create a dynamic, image slideshow. But what if you want to add content on top of that carousel for a hero section? With some extra CSS and javascript you can turn your background images and videos into a slideshow. 
First, let's go into the page builder and get things set up. Select the box you'd like to apply the background slideshow to. Add all the image and video backgrounds you'd like to cycle through. Give that same box a custom element name of "bg-slideshow".
Exit the page builder and navigate into the page settings. Create a new snippet and paste in the following code:
<style>
.bg-slideshow-slide {
opacity: 0;
transition: opacity 0.4s;
}
.bg-slideshow-active {
opacity: 1;
}
</style>
<script>
const sections = document.querySelectorAll('[id^="bg-slideshow"]');
function startSlideshow(index, images) {
images[index].classList.add('bg-slideshow-active');
setTimeout(function () {
images[index].classList.remove('bg-slideshow-active');
startSlideshow((index + 1) % images.length, images);
}, 5000);
}
sections.forEach((section) => {
const layers = [...section.children[0].children].filter(
(child) => child.children.length !== 0
);
layers.forEach((layer) => layer.classList.add('bg-slideshow-slide'));
startSlideshow(0, layers);
});
</script>
Enable the snippet for the builder as well as live pages so you can preview it as you edit your page. Change the "Place in" option and set it to <body>. Add the snippet to your page and go back into the builder. You should now see the slideshow box smoothly transitioning between images and videos.