furniture_design.html 3.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. <section class="bhouseweb_loc_banner">
  2. <img src="/img/banner/bn_product@2x.png" class="banner-img card-img" alt="...">
  3. </section>
  4. <!-- 手機版型 -->
  5. <div class="mobile-tab d-block d-md-none">
  6. <a href="/furniture_design/sofa" id="all-design-tab" class="nav-link">全部設計單品</a>
  7. <ul class="nav nav-pills mt-0 mt-lg-4 justify-content-center tab-title b-bottom" id="pills-tab" role="tablist">
  8. <li class="nav-item tab-item" role="presentation">
  9. <a href="/system_furniture" id="systeam-furniture-tab" class="nav-link">關於系統櫃</a>
  10. </li>
  11. <li class="nav-item tab-item" role="presentation">
  12. <a href="/solid_wood_furniture" id="furniture-tab" class="nav-link">關於家具</a>
  13. </li>
  14. <li class="nav-item tab-item" role="presentation">
  15. <a href="/about_mattress" id="mattress-tab" class="nav-link">關於床墊</a>
  16. </li>
  17. </ul>
  18. </div>
  19. <!-- 電腦版型 -->
  20. <div class="d-none d-md-block">
  21. <ul class="nav nav-pills mt-0 mt-lg-4 justify-content-center tab-title b-bottom" id="pills-tab" role="tablist">
  22. <li class="nav-item" role="presentation">
  23. <a href="/furniture_design/sofa" id="all-design-tab" class="nav-link">全部設計單品</a>
  24. </li>
  25. <li class="nav-item tab-item" role="presentation">
  26. <a href="/system_furniture" id="systeam-furniture-tab" class="nav-link">關於系統櫃</a>
  27. </li>
  28. <li class="nav-item tab-item" role="presentation">
  29. <a href="/solid_wood_furniture" id="furniture-tab" class="nav-link">關於家具</a>
  30. </li>
  31. <li class="nav-item tab-item" role="presentation">
  32. <a href="/about_mattress" id="mattress-tab" class="nav-link">關於床墊</a>
  33. </li>
  34. </ul>
  35. </div>
  36. <div class="bhouseweb_loc_content">
  37. <ul class="design-list mb-3 m-md-0">
  38. <li><a id="sofa" class="nav-link" href="/furniture_design/sofa/">沙發</a></li>
  39. <li><a id="side_table" class="nav-link" href="/furniture_design/side_table">茶几</a></li>
  40. <li><a id="dining_table" class="nav-link" href="/furniture_design/dining_table">餐桌</a></li>
  41. <li><a id="dining_chair" class="nav-link" href="/furniture_design/dining_chair">餐椅/中島椅</a></li>
  42. <li><a id="mattress" class="nav-link" href="/furniture_design/mattress/">床組</a></li>
  43. <li><a id="cabinet" class="nav-link" href="/furniture_design/cabinet">電視櫃</a></li>
  44. <li><a id="wardrobe" class="nav-link" href="/furniture_design/wardrobe">衣櫃/收納櫃/中島</a></li>
  45. <li><a id="Side_Cabinet" class="nav-link" href="/furniture_design/side_cabinet">邊櫃/邊几</a></li>
  46. <li><a id="desk" class="nav-link" href="/furniture_design/desk">書桌/工作桌</a></li>
  47. <li><a id="other_furniture" class="nav-link" href="/furniture_design/other_furniture">其他設計單品</a></li>
  48. </ul>
  49. </div>
  50. <div style="border-top: 1px solid grey; position: absolute; width: 100%; left: 0;"></div>
  51. <script>
  52. // 儲存點擊的 Link ID 後加上 Class Name (預設沙發頁)
  53. if (window.location.pathname === '/furniture_design/sofa/') {
  54. localStorage.setItem('assignLink', 'sofa');
  55. }
  56. let linkList = document.querySelectorAll(".design-list .nav-link");
  57. console.log('清單 linkList',linkList);
  58. for (let i = 0; i < linkList.length; i++) {
  59. linkList[i].addEventListener("click", function (e) {
  60. localStorage.setItem('assignLink', e.target.id);
  61. console.log('e.target.id', e.target.id);
  62. });
  63. }
  64. let linkID = localStorage.getItem('assignLink');
  65. let link = document.querySelector(`.design-list #${linkID}`);
  66. link.classList.add("assign-link");
  67. </script>