title: Scroll event using old value after screen resize
body: <p>I hope you are doing great and wish you a happy new year. </p>
  
  <p>I am trying to accomplish a simple thing with jquery. I want to have a function that gets called on load, resize and has a scroll event listener inside it. This function sets a flag when loaded which is used inside the scroll event to do some calculations.</p>
  
  <p>Here is my code: </p>
  
  <p>jQuery</p>
  
  <pre><code>function rezval() {
      var alpha = false;
      document.getElementById('output').innerHTML = '';
      window.addEventListener('scroll', function(e){
          //Some calculations here
          document.getElementById('output').innerHTML += alpha + '\r';
          alpha = true; //Updating flag
      });
  }
  $(window).resize(function() {
      rezval();
  });
  $(window).load(function() {
      rezval();
  });
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;div id="output" class="output-div"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>CSS </p>
  
  <pre><code>body {
      height:2000px; 
      background:#333; 
      overflow-x:hidden;
  }
  
  .output-div {
      font-size:14px; 
      color:#fff; 
      width:1000px;
  }
  </code></pre>
  
  <p>I want this function to set the value of variable 'alpha' as false (initially) whenever it gets called/recalled and update the value of flag at the end of the scroll event (I would be using the if condition later with the flag for the calculations). I am outputting the value of alpha just to highlight the issue.</p>
  
  <p>When i run load the function for the first time, it works perfectly. I get the following output: </p>
  
  <pre><code>false true true true...
  </code></pre>
  
  <p>The problem comes when i resize the window. The output that i get is something like</p>
  
  <pre><code>true false false false true true true.....
  </code></pre>
  
  <p>I am not being able to understand why is it showing </p>
  
  <p>1) True as the first output when it should be false. Its like the scroll event is caching the variable and recalling it</p>
  
  <p>2) Multiple false in the output when there should be just one </p>
  
  <p>I have also setup a jsFiddle to replicate this issue: <a href="http://jsfiddle.net/5dj0jLwn/" rel="nofollow">http://jsfiddle.net/5dj0jLwn/</a></p>
  
  <p>Any help would be appreciated. Thanks a lot in advance. </p>