hhh_index_dev/hhh_index/template/button.html

<!-- 右下角按鈕區塊 -->
<div class="btn-box text-center">
  <button data-gt-target="#top" data-gt-duration="100" data-gt-offset="0" class="btn-gotop" title="GoTop">
    <!-- <span class="top_img"></span> -->
    <img src="./hhh_index/images/icon/feather-chevron-right.svg" alt="">
  </button>
  <button title="為我推薦設計師" class="d-none d-md-inline">
    <a href="https://hhh.com.tw/about/request/" target="_blank">
      <img src="./hhh_index/images/icon/feather-file-text.svg" alt="">
    </a>
  </button>
  <button title="裝修預算評估" class="d-none d-md-inline">
    <a href="https://hhh.com.tw/about/contact/" target="_blank">
      <img src="./hhh_index/images/icon/ionic-ios-calculator.svg" alt="" style="width: 22px; margin-left: 3px;">
    </a>
  </button>
  <button title="+好物商城" class="d-none d-md-inline">
    <a href="https://shop.hhh.com.tw/" target="_blank">
      <img src="./hhh_index/images/icon/feather-shopping-cart.svg" alt="">
    </a>
  </button>
  <!-- 暫時隱藏 -->
  <!-- <button title="線上諮詢">
    <a href="https://hhh.com.tw/about/contact/" target="_blank">
      <img src="./images/icon/simple-hipchat.svg" alt="">
    </a>
  </button> -->
</div>

<div class="d-md-none justify-content-around mb-menu">
  <section title="為我推薦設計師">
    <a href="https://hhh.com.tw/about/request/" target="_blank">
      <img src="./hhh_index/images/icon/feather-file-text.svg" alt="為我推薦設計師">
      <h4>填需求</h4>
    </a>
  </section>
  <section title="裝修預算評估">
    <a href="https://hhh.com.tw/about/contact/" target="_blank">
      <img src="./hhh_index/images/icon/ionic-ios-calculator.svg" alt="裝修預算評估">
      <h4>估預算</h4>
    </a>
  </section>
  <section title="+好物商城">
    <a href="https://shop.hhh.com.tw/" target="_blank">
      <img src="./hhh_index/images/icon/feather-shopping-cart.svg" alt="+好物商城">
      <h4>+好物</h4>
    </a>
  </section>
  <section>
    <a href="https://m.hhh.com.tw/users">
      <img src="./hhh_index/images/icon/material-people.svg" alt="會員" style="filter: invert(67%) sepia(0%) saturate(0%) hue-rotate(242deg) brightness(91%) contrast(93%);">
      <h4>會員</h4>
    </a>
  </section>
</div>
<script>
  $(".btn-gotop").click(() => {
    $("html, body").animate(
      {
        scrollTop: 0,
      }, 0
    );
  });

  let footerHeight = $("#footer").height();
  let bodyHeight = $("body").height()
  // 滑到 footer 區塊隱藏下方選單
  $(window).scroll(function() {
    let height = (bodyHeight - footerHeight)-500;
    if ($(window).scrollTop() >height) {
      $('.mb-menu').css("opacity","0");
    } else {
      $('.mb-menu').css("opacity","1");
    }
});
</script>