CODEWITHSUNDEEP
jquery
user10567514
user10567514

Reputation: 27

Jquery show hide toggle

I have a script which slide toggles an element when clicked. Code below:

$(document).ready(function() {
  $(".accord").click(function() {
    $(this).next(".accordContent").slideToggle("fast");
  });
});

However, when the screen resolution is below 790px I want the element to have a default of not showing. I tried this in a media query but then the above script doesn't work when below that resolution. Guess it confuses it and need something more in JQuery. Any ideas?

Upvotes: 1

Views: 69

Answers (1)

Adam
Adam

Reputation: 425

Try this:

$(document).ready(function() {
    var winWidth = $(window).width();

    if (winWidth < 790){
     $(".accordContent").hide();
}

    $(".accord").click(function() {
    $(this).next(".accordContent").slideToggle("fast");
    });
});

Upvotes: 1

Related Questions