Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS Create a Fullscreen Slider with CSS

mariettagordon
mariettagordon
4,428 Points
Posted by mariettagordon
mariettagordon
4,428 Points

I want to automate the slider. How do I do that?

I just watched the tutorial on making a full screen slider but I want to make a slider like this that can flip through the slides automatically and also click to change slides if desired. Could someone point me toward a tutorial on how to do this?

2 Answers

Julie Myers
Julie Myers
7,627 Points
Julie Myers
Julie Myers
7,627 Points

You could use jQuery.

If you wanted to code it out from scratch start looking into javaScript timer methods such as setInterval(). This will get you started in the right direction.

mariettagordon
mariettagordon
4,428 Points
mariettagordon
mariettagordon
4,428 Points

I was hoping to do it with CSS. I saw one on a website that just used CSS. I looked at the code and tried to work it out but it didn't work for me. That is why I am looking for a tutorial or just some help or direction from here.

Julie Myers
Julie Myers
7,627 Points
Julie Myers
Julie Myers
7,627 Points

I've not made one. My guess is you will need to use CSS animation.

https://codepen.io/dudleystorey/pen/ehKpi -->shows you the coding. http://codepen.io/AMKohn/pen/EKJHf --> shows you the coding. http://cssslider.com/ --> It looks like a tool that will create it for you.