Question: How do I store the `window.innerWidth` value and calculate the difference with the new value on resize?

```
var w;

function example {

var onResize = function () {

    w = {width: window.innerWidth || document.body.clientWidth };

if (difference of old width and this (new) width is 100) {
// then do some stuff
}

window.addEventListener('resize', onResize);
onResize();
}

```

The solution would be to store the variable inside a global or outside on `onResize`, calculate the difference between the old and new data, do a condition of some sort: `(old width - new width) = 100?` and if the difference is 100 then do some stuff. 

Now conceptually I know how to achieve this, but how can I actually go about implementing it in JavaScript?

Answer: 
Store the current width as `oldWidth`. In `resize` listener check if current width differs form `oldWidth` by 100px (or more). If it does, then do some stuff and update the `oldWidth` with current value.

```
var oldWidth = window.innerWidth;
var onResize = function () {
var w = window.innerWidth;

    if ( Math.abs( w - oldWidth ) >= 100 ) {
    // then do some stuff
      console.log( 'diff >= 100px' );
      oldWidth = w;
    }
}

window.addEventListener('resize', onResize);

```

<http://jsfiddle.net/xtx1L6nr/>
Try the following. But be aware - "resize" events are sent periodically as the user resizes the window. This code will have the effect of detecting resizes that occur instantaneously (minimize, maximize) or very quickly - faster than 100px per render tick. If you want the *eventual* size of the final resize, once the user lets go, you'll need a timeout, like in the answer to this question: [Detect when a window is resized using JavaScript ?](https://stackoverflow.com/questions/2996431/detect-when-a-window-is-resized-using-javascript)

```
var previousWidth;
var detectBigChange = function () {
  var newWidth = window.innerWidth || document.body.clientWidth;
  if (!!previousWidth && Math.abs(newWidth - previousWidth) > 100) {
    console.log("Big change!");
  }
  previousWidth = newWidth;
}

window.addEventListener('resize', detectBigChange);
detectBigChange();

```