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 Emma Willmann
.a{fill-rule:evenodd;}techdegree seal-36
Emma Willmann
Treehouse Project Reviewer

Thoughts on my photo wall...

I've been playing around with overlapping divs on codepen and thought it would be a fun way to display photos, having them move to the top and show color when you hover on them. Thoughts?

http://codepen.io/KitPepperwig/pen/pvPmVW

4 Answers

Unsubscribed User
Unsubscribed User
17,284 Points
Unsubscribed User
Unsubscribed User
17,284 Points

Very cool Emma...I like it.

Emma Willmann
.a{fill-rule:evenodd;}techdegree seal-36
Emma Willmann
Treehouse Project Reviewer

Thanks so much. I did some updates on it to make it even better. :-)

kathrynpeterson
kathrynpeterson
16,001 Points
kathrynpeterson
kathrynpeterson
16,001 Points

The effect on hover is cool, and effective. I'd suggest, however that you give your original photos a bit more "breathing room," maybe make the starting thumbnails a little smaller and spread them apart a little more, so more of the original photo can be seen. The mish-mash is a little off-putting, and it's hard to know what one might want to hover on when so little of some of the originals can be seen. Just a thought.

Lee Reynolds Jr.
Lee Reynolds Jr.
5,160 Points

WOW! That is really fantastic!I'm nowhere near the level to match your skills. I really like what you've done there Emma. I do, however, agree with Katharyn here.

Emma Willmann
.a{fill-rule:evenodd;}techdegree seal-36
Emma Willmann
Treehouse Project Reviewer

Thanks for your thoughts Kathryn. I haven't made changes to this yet, but I do plan to spread them out a bit. I do want to have a little more showing, especially now that I've added a blur effect. At the same time, I do like that a lot of the picture is hidden so it's a bit of a surprise as to what you get.

jasonjones5
PLUS
jasonjones5
Courses Plus Student 5,571 Points
jasonjones5
jasonjones5
Courses Plus Student 5,571 Points

I also think it's a really cool effect, but agree that the hovered image is kind of 'lost' in the background. The usual response is to make the hovered image larger but it would be interesting to see other ways to keep the impact without being predictable. The colour vs. black & white is a really nice touch and if you could think of a way to exploit that further to really highlight the key image it would be a win imho.

Emma Willmann
.a{fill-rule:evenodd;}techdegree seal-36
Emma Willmann
Treehouse Project Reviewer

Thanks for your replay...I've done some updates to this which adds a blur to the greyscaled images along with a different box-shadow to the hovered image. I think both of these help the hovered image to pop quite a bit more. :-)

jasonjones5
PLUS
jasonjones5
Courses Plus Student 5,571 Points
jasonjones5
jasonjones5
Courses Plus Student 5,571 Points

That looks excellent. The blur makes you pay attention and wonder what it's about and the colour really does the trick when you hover. Definite reward for interaction. Nice.