vendredi 31 mars 2017

Remove an If Statement after it has been fired once

Is there anyway of removing an if statement after it has been fired once?

I have a menu container that shows on page load and want it so when the user scrolls 1px it slides away. I don't though want a the browser constantly tracking a scrollTop() method because of the performance hit from this.

What's the best way to remove or cancel an if statement after it has been used once?

The code is below and I have a codepen here: http://ift.tt/2oiOFQ7

jQuery(document).ready(function($) {
  $(window).scroll(function() {
    if ($(document).scrollTop() > 1) {
      $('.menubox').css('left', '-25%');
    }
  });

  $('.mybutton').on('click', function() {
    $('.menubox').css('left', '0%');
  });
});
body {
  margin: 0;
  padding: 0;
  height: 200vh;
}

.menubox {
  top: 100;
  position: fixed;
  width: 20%;
  height: 100%;
  background: red;
  padding: 10px;
  color: white;
  transition: all 1s;
}

.mybutton {
  position: fixed;
  left: 40%;
  top: 50px;
  padding: 5px 10px;
}
<script src="http://ift.tt/1oMJErh"></script>
<div class="menubox">Menu Box</div>
<button class="mybutton">menu</button>

Aucun commentaire:

Enregistrer un commentaire