button.html 2.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. <!-- 右下角按鈕區塊 -->
  2. <div class="btn-box text-center">
  3. <button data-gt-target="#top" data-gt-duration="100" data-gt-offset="0" class="btn-gotop" title="GoTop">
  4. <!-- <span class="top_img"></span> -->
  5. <img src="./hhh_index/images/icon/feather-chevron-right.svg" alt="">
  6. </button>
  7. <button title="為我推薦設計師" class="d-none d-md-inline">
  8. <a href="https://hhh.com.tw/about/request/" target="_blank">
  9. <img src="./hhh_index/images/icon/feather-file-text.svg" alt="">
  10. </a>
  11. </button>
  12. <button title="裝修預算評估" class="d-none d-md-inline">
  13. <a href="https://hhh.com.tw/about/contact/" target="_blank">
  14. <img src="./hhh_index/images/icon/ionic-ios-calculator.svg" alt="" style="width: 22px; margin-left: 3px;">
  15. </a>
  16. </button>
  17. <button title="+好物商城" class="d-none d-md-inline">
  18. <a href="https://shop.hhh.com.tw/" target="_blank">
  19. <img src="./hhh_index/images/icon/feather-shopping-cart.svg" alt="">
  20. </a>
  21. </button>
  22. <!-- 暫時隱藏 -->
  23. <!-- <button title="線上諮詢">
  24. <a href="https://hhh.com.tw/about/contact/" target="_blank">
  25. <img src="./images/icon/simple-hipchat.svg" alt="">
  26. </a>
  27. </button> -->
  28. </div>
  29. <div class="d-md-none justify-content-around mb-menu">
  30. <section title="為我推薦設計師">
  31. <a href="https://hhh.com.tw/about/request/" target="_blank">
  32. <img src="./hhh_index/images/icon/feather-file-text.svg" alt="">
  33. <h4>填需求</h4>
  34. </a>
  35. </section>
  36. <section title="裝修預算評估">
  37. <a href="https://hhh.com.tw/about/contact/" target="_blank">
  38. <img src="./hhh_index/images/icon/ionic-ios-calculator.svg" alt="">
  39. <h4>估預算</h4>
  40. </a>
  41. </section>
  42. <section title="+好物商城">
  43. <a href="https://shop.hhh.com.tw/" target="_blank">
  44. <img src="./hhh_index/images/icon/feather-shopping-cart.svg" alt="">
  45. <h4>+好物</h4>
  46. </a>
  47. </section>
  48. <section>
  49. <a href="https://m.hhh.com.tw/users">
  50. <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%);">
  51. <h4>登入</h4>
  52. </a>
  53. </section>
  54. </div>
  55. <script>
  56. $(".btn-gotop").click(() => {
  57. $("html, body").animate(
  58. {
  59. scrollTop: 0,
  60. }, 0
  61. );
  62. });
  63. let footerHeight = $("#footer").height();
  64. let bodyHeight = $("body").height()
  65. // 滑到 footer 區塊隱藏下方選單
  66. $(window).scroll(function() {
  67. let height = (bodyHeight - footerHeight)-500;
  68. if ($(window).scrollTop() >height) {
  69. $('.mb-menu').css("opacity","0");
  70. } else {
  71. $('.mb-menu').css("opacity","1");
  72. }
  73. });
  74. </script>