Jhey Tompkins
1 min readAug 9, 2017

--

Hey MDM!

Thanks for the kind words ๐Ÿ˜Š

I was able to create any number of slides with any of the effects ๐Ÿ˜•

One thing to make sure of is that although all of the HTML is created, are all the CSS rules generated that are necessary?

The stylus variable $noOfSlides must be updated to match the number of slides you wish to create or each of the rules for each slide must be written within your CSS;

.carousel__activator:nth-of-type(1):checked ~ .carousel__track {
transform: translateX(0%);
}
.carousel__activator:nth-of-type(1):checked ~ .carousel__slide:nth-of-type(1) {
animation: carousel-show-slide 0.5s;
top: 0;
left: 0;
right: 0;
}
.carousel__activator:nth-of-type(1):checked ~ .carousel__controls:nth-of-type(1) {
display: block;
}
.carousel__activator:nth-of-type(1):checked ~ .carousel__indicators .carousel__indicator:nth-of-type(1) {
opacity: 1;
}

I hope that can help you out!

--

--

Jhey Tompkins
Jhey Tompkins

Written by Jhey Tompkins

I make awesome things for awesome people!

No responses yet