You need to set the condition in jquery :

If aside.left_panel has style="display: none;" when the screen resolution is greater than 600px , then change in aside.left_panel to style="display: block" .

How can this issue be resolved?

  • one
    see media css requests, just css - Alex Gordon
  • Are you sure that you need to process the width of the screen, and not the display area of ​​the browser? If only browser a, then it can be done by means of css, which is a better option than js. - Aleksander K.

4 answers 4

I will correct the previous commentator a bit:

 function screen_check(){ if ($(window).width() >= 600) { $('.left_panel').style('display', 'block'); } else { $('.left_panel').style('display', 'none'); }; } screen_check(); $(window).on('resize', function(){ screen_check(); });

    Something like this:

     $(window).resize(function(){ if ($(this).width() > 600) { $('.left_panel').style("display": "block"); } else { $('.left_panel').style("display": "none"); } });
    • I'll fix it a bit: function screen_check () {if ($ (window) .width ()> = 600) {$ ('. Left_panel'). Style ('display', 'block'); } else {$ ('. left_panel'). style ('display', 'none'); }; } screen_check (); $ (window) .on ('resize', function () {}); - Sergey

    and a couple more fixes and normal:

     function screen_check(){ if ($(window).width() >= 600) { $('.left_panel').css('display', 'block'); } else { $('.left_panel').css('display', 'none'); };} 
       .left_panel { display: none; } @media all and (min-width:600px) { .left_panel { display: block; } }

      PS: How many can you push the scripts anywhere?

      • ps: not always true - Sergeo Ayshev
      • @SergeoAyshev, not always, but quite often. What this option is not suitable? Nowhere do I see anything written on this topic. - Qwertiy ♦