Tag: ♦♦♦♦

background-image

Sass image slider with text animation

A responsive image slider with textoverlay, without any JavaScript

A few months ago I showed you how to write an image slider with Sass only. A while ago I was asked to write a slider with text and animating that text as well. So I took the code and modified it to suit my needs. Today I wanted to sit down and write a post about it, because it has been a while, sorry for that.

Continue reading “Sass image slider with text animation”

background-image

A responsive Image Slider with Sass

Do JavaScript-Work with a Sass mixin

I was looking for a simple responsive image Slider featuring as little markup as possible. It should not be fancy or packed with features, just plain old scrolling through some images. While searching CodePen for inspiration I acutally ran over this pen which was doing exactly what I wanted. Also with CSS only. But when I was trying to write keyframes for another amount of images I though that it would get way overboard if I needed to recalculate the numbers whenever I wanted to change the image count. So I took over the CSS into my Sass workspace and wrote a mixin for the keyframes. This is what I want to go over today. You can check out the demo here if you want to have it full screen.

Continue reading “A responsive Image Slider with Sass”