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

Posted by troy beckett
troy beckett
12,035 Points

help with image gallery??

I'm currently trying to put an image gallery together.

Currently I have a bunch of thumbnails and when you click on the thumbnails a bigger picture appears next to them in a div.

I've achieved this by putting a link round the thumbnails, with the href of larger versions of the thumbnails. This looks pretty good and creates a decent looking gallery.

However I've just learnt the lightbox tutorial on treehouse and I would like to be able to click on the larger images and make them even bigger by triggering a lightbox.

My problem is that the larger images dont have a link round them so I can't click them to then trigger the light box.

So basically how would I go about putting a light box on my current image gallery.

my current html code is like this:

<body> <div id="thumbnails"> <a href="#large-photos"><img src="#thumbnails"/></a> <a href="#large-photos"><img src="#thumbnails"/></a> <a href="#large-photos"><img src="#thumbnails"/></a> </div>

<div id="large-photo">
</div> <body>