Push-out drawer from right pop'e out from fraction of second whenever page is refreshed

Here is my jQuery code - the issue is the push-out drawer that slides through the right button opens and closes immediately every time when the page is refreshed. I won't push the drawer button should only open the slider when clicked on the button otherwise it should always stay closed. The code below works absolutely fine. The only issue is on every page when load it opens and closes immediately. it should stay closed no matter what and only open when the user clicks on it.

html code:

<div class="wrap-vertical-drawer" style="overflow:hidden;">
  <div class="slide-drawer">
    <h2 class="horizontal-text"><br>FREE SHIPPING</h2>
    <h2 class="horizontal-text"><br>For AUS orders over $109.90</h2>
  </div>
  <div class="button-drawer">
    <h1 class="vertical-text">&nbsp;&nbsp;GET&nbsp;&nbsp;FREE&nbsp;&nbsp;SHIPPING</h1>
  </div>

</div>

  css code: .horizontal-text {
    color: #ffffff;
    font-size: 18px;
    margin: 20px;
    text-align: center;
  }

  .vertical-text {
    color: #ffffff;
    cursor: pointer;
    background-color: #000000;
    font-size: 24px;
    margin-top: 240px;
    padding: 5px;
    text-align: center;
    -moz-transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
  }


  .wrap-vertical-drawer {
    position: fixed;
    top: 250px;
    right: 0;
    z-index: 10;
  }

  .slide-drawer {
    background-color: #000000;
    float: right;
    width: 280px;
    height: 280px;
    -moz-border-radius: 3px 0px 0px 3px;
    -webkit-border-radius: 3px 0px 0px 3px;
    border-radius: 3px 0px 0px 3px;
    z-index: 10;
  }

  .button-drawer {
    color: #000000;
    float: right !important;
    width: 40px;
    height: 280px;
    padding: 5px 6px 10px 10px;
    text-align: center;
    position: relative;
    top: 0px;
    right: 2px;
    border-radius: 0px 0px 0px 0px;
    background-color: #000000;
    z-index: 10;

  }

  .button-drawer:hover {
    color: black;
    -moz-box-shadow: inset -2px 0px 50px black;
    -webkit-box-shadow: inset -2px 0px 50px black;
    box-shadow: inset -2px 0px 20px black;
  }

<script>
  $(document).ready(function () {

    $(".button-drawer").click(function () {
      if ($(".slide-drawer").css("marginRight") == "-2000px") {
        $(".slide-drawer").animate({
          marginRight: "0px"
        });
      } else if ($(".slide-drawer").css("marginRight") == "0px") {
        $(".slide-drawer").animate({
          marginRight: "-2000px"
        });
      }
    });
    setTimeout(function () {
      $(".slide-drawer").animate({
        marginRight: "-2000px"
      });
    }, 0);

  });
</script>