Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

HTML

Eric Nevitt
Eric Nevitt
4,914 Points
Posted by Eric Nevitt
Eric Nevitt
4,914 Points

Responsive rollovers

I am working on making my site responsive. So far, so good, however, there is one part I'm having trouble and that's the rollover items in my menu. The problem occurs when the screen is sized at 320px as its width. The menu works and looks OK with the images there. What I'm looking for it to do is have my logo on top and the menu items in text without images. It would be easier if I could post a picture to show what I'm wanting to do.

Adam Sackfield
Adam Sackfield
Courses Plus Student 19,663 Points

Would be good to see a demo of what the problem is. Try adding the code to codepen.io it's free. Then add images to tinypic and link them so we can get a feel for what is going on.

Dave McFarland
Dave McFarland
Treehouse Teacher
Dave McFarland
Dave McFarland
Treehouse Teacher

Are you placing actual images -- the <img> tag -- inside these menus? If so, you should use CSS background images, then at your breakpoint CSS in your media query you can hide the images.

Adam Sackfield
Adam Sackfield
Courses Plus Student 19,663 Points

That's one of my favourite sites. I think it's a little more complex than rollovers though. AJAX based content I believe. I would have to try and deter you from using DreamWeaver and rollovers really and use a less bloated editor like Sublime and try to create it in there.

Eric Nevitt
Eric Nevitt
4,914 Points
Eric Nevitt
Eric Nevitt
4,914 Points

Where can I find a plugin or instructions to do what I'm looking for?

Adam Sackfield
Adam Sackfield
Courses Plus Student 19,663 Points

The site you are using as inspiration is very advanced so you would need a solid understanding of HTML, CSS, JavaScript and then AJAX to complete it. The best lpace to start is here and maybe codeschool.