title: jQuery width change detection
body: <p><strong>Now Solved, thanks</strong></p>
  
  <p>I have see a lot of near answers to my problem with resize(), here is my code:</p>
  
  <p>'larger()' is a layout function that I want to call when screen width regardless of device orientation is >= 501, 'smaller()' is a function that i want to call when the screen width is &lt; 501.</p>
  
  <p><strong>My problem I have is that</strong> I don't want these functions to be called when the window.height changes.  Note that in my page I am using an accordion in mobile view and if I expand an accordion panel, it adds height to the page, even though the browser window hasn't been re-sized.  jQuery sees this as a window.resize.</p>
  
  <pre><code>$(window).resize(function(e) {
      var winWidth = $(window).width();
      if (winWidth &gt;= 501){
         larger();
      }
      if (winWidth &lt; 501){
         smaller();
      }
  });
  </code></pre>
  
  <p>any answers appreciated, and let me know if I need to clarify anything.</p>
  
  <p>I am using <code>jquery-1.11.0.min.js</code> with <code>jquery-ui-1.10.3.custom.min.js</code></p>
  
  <p>Thanks</p>