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

Posted by Mar Bocatcat
Mar Bocatcat
7,405 Points

Code Review

Hey guys,

Would someone be able to take a look at my code. I wanted to know if there is a another way to code this (maybe a little bit more structured, cleaner code?). I wanted it be a carousel slider type practice website.

http://codepen.io/marmarley92/full/wKpbwW/

Any advice/edit is appreciated.

Thanks!

4 Answers

Christian Kroul
Christian Kroul
9,849 Points

Well one approach is using a plugin, here are some plugin links

also take away the last 4 characters in the address bar, i don't know why that is happening for this link below

Click This

Click this

Or if you want to hand code a carousel, you can click this

link

Me Personally, i would use a plugin, it may be hard to understand, i know i have hard times, but its worth it

Mar Bocatcat
Mar Bocatcat
7,405 Points

Thank you , this is helpful! Last one question. In terms of learning javascript since im new to coding itself. Do you think its helpful if i learn it from scratch , i feel like plugins make it a little easy.

ivannnnn
ivannnnn
58 Points
ivannnnn
ivannnnn
58 Points

In your CSS you can write: 

a:link, a:visited {
  color: #fff;
}

The concept behind sliders is to put the whole ul into one div that is as big as one slide. The div needs to have overflow: hidden so that only one slide can be seen. Then you move that whole ul left or right with javascript so that the visible slide slides out and another slide becomes visible. CSS transitions can help you there or you may use jQuery animate(); Hope this is clear enough.

Mar Bocatcat
Mar Bocatcat
7,405 Points

Thank you! This helped!

Christian Kroul
Christian Kroul
9,849 Points
Christian Kroul
Christian Kroul
9,849 Points

the only Carousel sliders i know are made with javascript, or a plugin

Mar Bocatcat
Mar Bocatcat
7,405 Points

I know , I wanted a review on my HTML/CSS since im fairly new to it. Like the structure, if im using elements right, my div's, or tips on how to clean it up/organize it.

Im gonna add the javascript later.

Thanks!

Christian Kroul
Christian Kroul
9,849 Points
Christian Kroul
Christian Kroul
9,849 Points

Well the syntax is valid, and that would be the approach i would make, and it Design is very clean, just try adding

this property, if you want the links to be horizontal.

display: inline;

It also saves space if im correct

Mar Bocatcat
Mar Bocatcat
7,405 Points

Thanks ! and i will give that a try. Also since were already talking about carousel's. LOL Do you know how should I should approach on inserting one? Any videos? Still trying to figure out how i should go about it.

Thanks again!