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

General Discussion

Posted by Adam Sackfield
Adam Sackfield
Courses Plus Student 19,663 Points

Little guidance please

Hi, i am looking to achieve the following, i know i can use javascript/jquery to do it but looking for alternatives.

So say i have a list of links on the left of the page around 30% and the other 70% is on the right for content. What i want to do is when each one of the li's is clicked i want content to be put into the 70% part. Then when another is clicked i want it to update to the correct content.

Can this be done with PHP and a Database? The reason i don't want JS is come people have it disabled and wouldn't work. Any advice would be greatly received.

2 Answers

Tom Bedford
Tom Bedford
15,645 Points
Tom Bedford
Tom Bedford
15,645 Points

Is it an option to have a fixed list on the left with anchor tags linking to text on the right hand side side - so it would jump up/down the page when you click a link in the list? Or, have that as the default behavior and use JS to just show one at a time for those that have it enabled.

Here is an example of the first idea (page jumps up and down, static navigation) though the list is on the right in this case. This has been enhanced with jQuery so that it smoothly scrolls between the content. This is from a tutorial posted on the forums recently. With JS disabled it would still work just without the scrolling effect.

Adam Sackfield
Adam Sackfield
Courses Plus Student 19,663 Points

Sorted it now thanks. Ended up stumbling upon div:target in css3. so hidden them all to start and they appear as like they would using JS but its pure CSS here is a fiddle i found if your interested.

Tom Bedford
Tom Bedford
15,645 Points
Tom Bedford
Tom Bedford
15,645 Points

I don't believe :target works on IE8 and below without a polyfill (which would need JS), so some sort of fallback may be needed depending one what you are using this for.

Adam Sackfield
Adam Sackfield
Courses Plus Student 19,663 Points

Ok thanks for the tip. Just out of interest how many people can really be on IE8 doesn't everybody update their browsers. This is something i don't understand too much on really

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

> I don't believe :target works on IE8 and below without a polyfill

That's what selectivizr is for

Tom Bedford
Tom Bedford
15,645 Points
Tom Bedford
Tom Bedford
15,645 Points

Windows XP is stuck on IE8 I think usage is around 8-10% so it's a significant minority. Even if someone has diligently done all their "Windows Updates" they would still have IE8 if they hadn't looked elsewhere for a browser.

Adam Sackfield
Adam Sackfield
Courses Plus Student 19,663 Points

Thanks again it makes more sense now to be why people would be stuck on old browsers. I will look for a fallback for older browsers.