Triggering JQuery Script At Specific Page Width Is Not Working As Expected

Triggering JQuery Script At Specific Page Width Is Not Working As Expected

I have a responsive page that rearranges its layout depending on the user's screen resolution. I'm using  jQuery insertAfter(), insertBefore(), addClass(), and removeClass() methods to rearrange various elements on my page. 

I have posted the markup, scripts, and css to this question before but received a few replies and none of them was helpful to solving my problem.

The problem I'm having is that the script does not work at the page width specified in my if statement. Instead, the script is triggered several pixels after the specified page width. 

It appears the value of the expression $(windows).width() does not give the correct value so I tried to compensate by adding 15 pixels to the max-width of the media query. 

After the comprnsation my web page breaks at fewer page widths than before but the problem is still not solved. Below is a snippet of my script

  1. if($(window).width() <= 860  )
  2. {
  3.   // Do Something
  4. }