[Javascript](jquery) - 스크롤 이동시 메뉴 고정 (미설명)

// html

      <div class="left">
        <div class="leftTitle">
          <p>Hello World</p>
        </div>
      </div>

// script
import $ from 'jquery'
  $(document).ready(function(){
    $(window).scroll(function(){
      var scrollValue = $(this).scrollTop()
      if(scrollValue>411) {
        $(".left").css("position", "fixed");
        $(".left").css("top", "0");
        $(".left").css("left", "0");
        $(".center").css("margin-left", "19%")
      } else {
        $(".left").css("position", "relative");
        $(".center").css("margin-left", "3%")
      }
    })
  })

// css
.left {
  width: 15%;
  height: 750px;
  background: #e9ecf1;
  margin-left: 1%;
}
.leftTitle {
  width: 100%;
  height: 50px;
  background: #0076e5;
}​

스크롤 400 이하 이동시 메뉴

스크롤 400 이상 이동시 메뉴