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

JavaScript

Creating A Slideshow

I've been working on my first site, which is mostly the site you create with "building your first website" track and adding changes from other lessons I've learned here, so I've created a simple Lightbox, added a select menu on mobile widths all using jQuery, and adding a contact form from what I've learned in php.

What I really want to do is create a slideshow for my home page, but I'm not sure how, the plugins confuse me, and I want to learn how to make it so at least I can tell an employer I know how it works and how to create one, since I've coded basically everything else on my site from scratch, and I can explain how those things work and were made.

It would be great if this was a lesson on treehouse, but I would love any suggestions on how I can get started building my first slideshow, or plugins with good documentation to help explain what I'm doing.

Thanks, Devin

1 Answer

Essentially what you could do is have a bunch of elements such as sections (section 1 -how every many slides) have all of them display:none or something like that or off screen. Write some jquery to say hey I want this slide to show so you animate it to be visible or slide in have a certain amount of time elapse then make it invisible well starting to animate the next section to slide in or make visible.

There are many different ways to do this. And a lot of slider plugins.

Now if you want a real slideshow with direction you can take out the time elapse and use key codes for the arrow keys and when that key is pressed do the animate the next slide.

If you post some code id be happy to help.

When I get a chance to type some up I'll try to remember to post it on here, I'm working on creating a modal for my contact form at the moment.