<div class="fab-container" id="fabContainer">
  
  <div class="fab-menu" id="fabMenu">
    <a href="https://www.sdijbooks.com/authors/1075" class="fab-item btn-pink" target="_blank">UAA 생명과학Ⅱ</a>
    <a href="https://www.sdijbooks.com/authors/1079" class="fab-item btn-green" target="_blank">UAA 수학</a>
    <a href="https://www.sdijbooks.com/authors/1012" class="fab-item btn-blue" target="_blank">DCAF 생명과학Ⅰ & 통합과학</a>
    <a href="https://www.sdijbooks.com/authors/1061" class="fab-item btn-purple" target="_blank">NARSHA 사회·문화</a>
  </div>
  
  
  <button class="fab-main" onclick="toggleFab()">
    🔗 UND 콘텐츠 구매
  </button>
</div>


<script>
  // 1. 메뉴 토글 기능
  function toggleFab() {
    var menu = document.getElementById('fabMenu');
    menu.classList.toggle('active');
  }

  // 2. 화면 스크롤 시 부드럽게 따라오게 만드는 기능
  var container = document.getElementById('fabContainer');

  function updateContainerPosition() {
    var scrollTop = window.scrollY || document.documentElement.scrollTop;
    var windowHeight = window.innerHeight;
    // 화면 하단에서 90px 정도 띄운 위치로 목표점 설정
    var targetTop = scrollTop + windowHeight - 90; 
    container.style.top = targetTop + 'px';
  }

  // 스크롤하거나 창 크기가 바뀔 때마다 위치 업데이트
  window.addEventListener('scroll', updateContainerPosition);
  window.addEventListener('resize', updateContainerPosition);
  window.addEventListener('load', updateContainerPosition);
  
  // 최초 로딩 시 위치를 바로 잡아줌
  updateContainerPosition();
</script>

www.undteam.com

수능/내신 전문 콘텐츠 제작 그룹 UND의 공식 홈페이지입니다.

나르샤 사문 구매자 생생 후기 모음