Do something if screen width is less than 960 px

Question

How can I make jQuery do something if my screen width is less than 960 pixels  The code below always fires the 2nd alert  regardless of my window size    if  screen width  lt  960        alert  Less than 960      else        alert  More than 960

User · Answer

I would suggest  jQuery needed            windowSize    call this function to get windowSize any time     function windowSize       windowHeight   window innerHeight   window innerHeight     window  height      windowWidth   window innerWidth   window innerWidth     window  width          Init Function of init it wherever you like    windowSize        For example  get window size on window resize   window  resize function       windowSize      console log  width is     windowWidth   Height is     windowHeight     if  windowWidth  lt  768        console log  width is under 768px                Added in CodePen    http   codepen io moabi pen QNRqpY editors 0011  Then you can get easily window s width with the var   windowWidth  and Height with   windowHeight   otherwise  get a js library    http   wicky nillia ms enquire js

User · Answer

I know i m late to answer this  but i hope it is of some help to anybody who have similar problem  It also works when page refreshes for any reason      document  ready function     if    window  width    lt  960  amp  amp    window  load                  up   hide               if   window  load             if    window  width    lt  960                up   hide                       window  resize function         if    window  width    lt  960  amp  amp    window  load                  up   hide              else              up   show               if   window  load             if    window  width    lt  960                up   hide                        else              up   show

User · Answer

nope  none of this will work  What you need is this     Try this   if  screen width  lt   960      alert  Less than 960      else if  screen width  gt 960      alert  More than 960

User · Answer

Adds and removes body class depending on screen width  function screenClass         if   window  innerWidth    gt  960               body   addClass  big-screen   removeClass  small-screen          else              body   addClass  small-screen   removeClass  big-screen                Fire  screenClass        And recheck when window gets resized    window  bind  resize  function        screenClass

User · Answer

use     window  width     or    document  width     or     body   width

User · Answer

I recommend to not use jQuery for such thing and proceed with window innerWidth   if  window innerWidth  lt  960        doSomething

User · Answer

You might want to combine it with a resize event      window  resize function       if    window  width    lt  960         alert  Less than 960         else       alert  More than 960             For R J    var eventFired   0   if    window  width    lt  960        alert  Less than 960       else       alert  More than 960        eventFired   1       window  on  resize   function         if   eventFired            if    window  width    lt  960                alert  Less than 960 resize              else               alert  More than 960 resize                          I tried http   api jquery com off  with no success so I went with the eventFired flag

User · Answer

Use jQuery to get the width of the window    if    window  width    lt  960       alert  Less than 960      else      alert  More than 960

User · Answer

You can also use a media query with javascript        const mq   window matchMedia    min-width  960px       if  mq matches           alert  window width  gt   960px      else        alert  window width  lt  960px

User · Answer

Try this code  if    window  width    lt  960     alert  width is less than 960px      else    alert  More than 960         x000D   x000D     if    window  width    lt  960    x000D       alert  width is less than 960px    x000D        x000D      else   x000D       alert  More than 960    x000D        x000D   lt script src  https   ajax googleapis com ajax libs jquery 2 1 1 jquery min js  gt  lt  script gt  x000D   x000D   x000D

[javascript] Do something if screen width is less than 960 px

Examples related to javascript

Examples related to jquery