title: Jquery Css change when div hit the top of the page
body: <p>Good morning to everybody!</p>
  
  <p>Today I'm in a trouble with this code...I want that the element ".cubo" moves when the "#team" section is in the viewport.</p>
  
  <p>I tried with this code :</p>
  
  <pre><code>var team = $('#team').offset().top;
  
  $(window).on( 'scroll', function(){
          if ($(window).scrollTop() &gt;= team) {
              $('.cubo').css({top:"10%", left: "30%"});
          } else {
              $('.cubo').css({top: "0", left:"0"});
          }
      });
  </code></pre>
  
  <p>It works fine if I refresh the page when "#team" is already in the viewport...but if I scroll by the "#home" it doesn't works... why!??!</p>
  
  <p>Please, can you tell me?</p>
  
  <p>Thank you</p>