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 Richard Feinburg
Richard Feinburg
2,970 Points

Media Query and CSS

Not good at jQuery/Javascript and can't this javascript to work. I know I'm reading it wrong. Trying to hide a DIV when under 760px for a menu. What Im I doing wrong?

<script language="javascript">
$(document).ready(function() {
    $('#company-button').click(function() {
        $('.company-list').toggle("fade");
    });
    if ($(window).width() < 760){
        if ($('.company-list').css('display') == "none" ){
        }
    }
    });
</script>

3 Answers

Richard Feinburg
Richard Feinburg
2,970 Points

I got it!

<script language="javascript">
$(document).ready(function() {
    $('#company-button').click(function() {
        $('.company-list').toggle("fade");
    });
    if ($(window).width() < 760){
        $(".company-list").css("display", "none");
    }
    });
</script>
Thiago Xavier
Thiago Xavier
783 Points
Thiago Xavier
Thiago Xavier
783 Points

Hi Richard, try tu use only css3 media queries, remove your if statement and put this in your css:

@media all and (max-width:760px) { 
  .company-list {
    display:none;
  }
}

it should work!

Paulo Aguiar
Paulo Aguiar
14,120 Points
Paulo Aguiar
Paulo Aguiar
14,120 Points

Agreed, this type of thing is much simpler as a media query.