|
@@ -0,0 +1,564 @@
|
|
|
|
+<!DOCTYPE html>
|
|
|
|
+<html lang="en">
|
|
|
|
+
|
|
|
|
+<head>
|
|
|
|
+ <!-- Google Tag Manager -->
|
|
|
|
+ <script>(function (w, d, s, l, i) {
|
|
|
|
+ w[l] = w[l] || []; w[l].push({
|
|
|
|
+ 'gtm.start':
|
|
|
|
+ new Date().getTime(), event: 'gtm.js'
|
|
|
|
+ }); var f = d.getElementsByTagName(s)[0],
|
|
|
|
+ j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src =
|
|
|
|
+ 'https://www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f);
|
|
|
|
+ })(window, document, 'script', 'dataLayer', 'GTM-W3RJHTZ');</script>
|
|
|
|
+ <!-- End Google Tag Manager -->
|
|
|
|
+
|
|
|
|
+ <script async="" src="https://www.googletagmanager.com/gtm.js?id=GTM-W3RJHTZ"></script>
|
|
|
|
+ <!-- <script src="https://connect.facebook.net/signals/config/585285442299590?v=2.9.100&r=stable" async=""></script> -->
|
|
|
|
+
|
|
|
|
+ <meta charset="UTF-8" />
|
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
|
|
+ <meta http-equiv="X-UA-Compatible" content="ie=edge, Chrome=1" />
|
|
|
|
+ <meta http-equiv="Cache-Control" content="no-cache" />
|
|
|
|
+ <meta name="copyright" content="2021 © 幸福空間 │ All Rights Reserved." />
|
|
|
|
+ <meta name="creation-date" content="2021-08-05 12:00:04 GTM+8" />
|
|
|
|
+ <meta name="description" content="讓幸福室內設計,走進您的生活,解決您的裝潢問
|
|
|
|
+ 題!幸福空間是台灣最大的室內設計、設計師與設計個案影音平台之一,找尋室內設計點子與案例我
|
|
|
|
+ 們一定能幫助你!" />
|
|
|
|
+ <meta name="distribution" content="Taiwan" />
|
|
|
|
+ <meta name="keywords" content="" />
|
|
|
|
+ <meta name="revisit-after" content="1 days" />
|
|
|
|
+ <meta name="robots" content="all" />
|
|
|
|
+ <meta name="format-detection" content="telephone=no" />
|
|
|
|
+
|
|
|
|
+ <meta property="og:description" content="讓幸福室內設計,走進您的生活,解決您的裝潢問題!
|
|
|
|
+ 幸福空間是台灣最大的室內設計、設計師與設計個案影音平台之一,找尋室內設計點子與案例我們一定能幫助
|
|
|
|
+ 你!" />
|
|
|
|
+ <meta property="og:site_name" content="幸福空間" />
|
|
|
|
+ <meta property="og:title" content="幸福空間 - 台灣最大的室內設計、設計師與設計個案影音平台" />
|
|
|
|
+ <meta property="og:type" content="website" />
|
|
|
|
+ <meta property="og:locale" content="zh_TW" />
|
|
|
|
+
|
|
|
|
+ <title>幸福空間 - 室內設計、裝潢、居家生活、影音平台</title>
|
|
|
|
+
|
|
|
|
+ <link rel="icon" href="../../img/favicon.ico" />
|
|
|
|
+
|
|
|
|
+ <!-- Fontawesome -->
|
|
|
|
+ <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css"
|
|
|
|
+ integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp" crossorigin="anonymous" />
|
|
|
|
+ <!-- Bootstrap -->
|
|
|
|
+ <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet"
|
|
|
|
+ integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous" />
|
|
|
|
+ <!-- axios -->
|
|
|
|
+ <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
|
|
|
|
+ <!-- Google Font -->
|
|
|
|
+ <link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
|
|
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
|
|
+ <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;600&display=swap" rel="stylesheet" />
|
|
|
|
+ <!-- CSS -->
|
|
|
|
+ <link rel="stylesheet" href="../../css/reset.css" />
|
|
|
|
+ <link rel="stylesheet" href="../../css/lists.css" />
|
|
|
|
+ <link rel="stylesheet" href="../../css/all.css" />
|
|
|
|
+</head>
|
|
|
|
+
|
|
|
|
+<body>
|
|
|
|
+ <!-- 動態載入 -->
|
|
|
|
+ <div id="navbar"></div>
|
|
|
|
+
|
|
|
|
+ <!-- searchModal -->
|
|
|
|
+ <div class="modal fade search-modal" id="searchModal" tabindex="-1" aria-labelledby="searchModalLabel"
|
|
|
|
+ aria-hidden="true">
|
|
|
|
+ <div class="modal-dialog modal-dialog-centered modal-lg">
|
|
|
|
+ <div class="modal-content">
|
|
|
|
+ <div class="modal-body">
|
|
|
|
+ <div class="input-group">
|
|
|
|
+ <input type="text" class="form-control keyword" placeholder="請輸入關鍵字" aria-label="Please enter keywords"
|
|
|
|
+ aria-describedby="search-input" />
|
|
|
|
+ <span class="input-group-text" id="search-input">全站搜尋</span>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <section class="keyword-list">
|
|
|
|
+ <span>熱搜關鍵字:</span>
|
|
|
|
+ <ul>
|
|
|
|
+ <li>客變</li>
|
|
|
|
+ <li>小坪數</li>
|
|
|
|
+ <li>老屋翻新</li>
|
|
|
|
+ <li>收納</li>
|
|
|
|
+ <li>軟裝佈置</li>
|
|
|
|
+ <li>新手裝修</li>
|
|
|
|
+ <li>風水</li>
|
|
|
|
+ <li>北歐風</li>
|
|
|
|
+ </ul>
|
|
|
|
+ </section>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+
|
|
|
|
+ <div class="container d-flex flex-column align-items-center justify-content-center list-content">
|
|
|
|
+ <!-- 搜尋 -->
|
|
|
|
+ <div class="row w-100 justify-content-center mt-5">
|
|
|
|
+ <div class="col-md-10">
|
|
|
|
+ <div class="card search-card">
|
|
|
|
+ <div class="card-body p-4">
|
|
|
|
+ <div class="input-group input-group-lg mb-2">
|
|
|
|
+ <input type="text" placeholder="請輸入關鍵字" aria-label="請輸入關鍵字" aria-describedby="searchbar"
|
|
|
|
+ class="form-control border-primary keywords" autocomplete="off">
|
|
|
|
+ <div class="input-group-append">
|
|
|
|
+ <button onclick="designerSearch()" type="button" data-ga="View_Search_Results"
|
|
|
|
+ class="input-group-text">搜尋</button>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+
|
|
|
|
+ <div class="search-bar-keyword d-flex mt-3 pl-4">
|
|
|
|
+ <p class="ms-3 text-muted">熱搜關鍵字</p>
|
|
|
|
+ <ul class="d-flex flex-wrap ps-3">
|
|
|
|
+ <li>
|
|
|
|
+ <a href="javascript:void(0)" data-ga="Click_Promo_Keyword">客變</a>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <a href="javascript:void(0)" data-ga="Click_Promo_Keyword">小坪數</a>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <a href="javascript:void(0)" data-ga="Click_Promo_Keyword">老屋翻新</a>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <a href="javascript:void(0)" data-ga="Click_Promo_Keyword">收納</a>
|
|
|
|
+ </li>
|
|
|
|
+ <!-- <li>
|
|
|
|
+ <a href="javascript:void(0)" data-ga="Click_Promo_Keyword">軟裝佈置</a>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <a href="javascript:void(0)" data-ga="Click_Promo_Keyword">新手裝修</a>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <a href="javascript:void(0)" data-ga="Click_Promo_Keyword">風水</a>
|
|
|
|
+ </li> -->
|
|
|
|
+ <li>
|
|
|
|
+ <a href="javascript:void(0)" data-ga="Click_Promo_Keyword">北歐風</a>
|
|
|
|
+ </li>
|
|
|
|
+ </ul>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+
|
|
|
|
+ <!-- 篩選 -->
|
|
|
|
+ <div class="row w-100 mt-5 filter-list">
|
|
|
|
+ <div class="col-12">
|
|
|
|
+ <p class="mb-3 text-muted">
|
|
|
|
+ 總共 <span id="totalCount" class="text-primary font-weight-bold fs-4">254</span> 筆全國室內設計師符合條件
|
|
|
|
+ </p>
|
|
|
|
+
|
|
|
|
+ <div class="card text-dark bg-light border-0 mb-3 w-100 shadow-sm">
|
|
|
|
+ <div class="card-body d-flex flex-wrap">
|
|
|
|
+ <div class="dropdown">
|
|
|
|
+ <button class="btn dropdown-toggle fw-bold search-tab" type="button" id="tag_vtype"
|
|
|
|
+ data-bs-toggle="dropdown" aria-expanded="false">
|
|
|
|
+ 單元類型
|
|
|
|
+ </button>
|
|
|
|
+
|
|
|
|
+ <ul class="dropdown-menu" aria-labelledby="video_type">
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_all">
|
|
|
|
+ <label class="form-check-label" for="video_type_all">
|
|
|
|
+ 不拘
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_soft">
|
|
|
|
+ <label class="form-check-label" for="video_type_soft">
|
|
|
|
+ 軟裝佈置
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_small">
|
|
|
|
+ <label class="form-check-label" for="video_type_small">
|
|
|
|
+ 小坪數
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_big">
|
|
|
|
+ <label class="form-check-label" for="video_type_big">
|
|
|
|
+ 大坪數
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_program">
|
|
|
|
+ <label class="form-check-label" for="video_type_program">
|
|
|
|
+ 節目
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_happiness">
|
|
|
|
+ <label class="form-check-label" for="video_type_happiness">
|
|
|
|
+ 幸福達人
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_encyclopedia">
|
|
|
|
+ <label class="form-check-label" for="video_type_encyclopedia">
|
|
|
|
+ 居家小百科
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_happysale">
|
|
|
|
+ <label class="form-check-label" for="video_type_happysale">
|
|
|
|
+ 幸福開賣拉
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_knowledge">
|
|
|
|
+ <label class="form-check-label" for="video_type_knowledge">
|
|
|
|
+ 裝修知識庫
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_directly">
|
|
|
|
+ <label class="form-check-label" for="video_type_directly">
|
|
|
|
+ 直擊名人的家
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_storage">
|
|
|
|
+ <label class="form-check-label" for="video_type_storage">
|
|
|
|
+ 小屋收納特輯
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_FengShui">
|
|
|
|
+ <label class="form-check-label" for="video_type_FengShui">
|
|
|
|
+ 居家風水特輯
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_Brand">
|
|
|
|
+ <label class="form-check-label" for="video_type_Brand">
|
|
|
|
+ 品牌故事
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_travel">
|
|
|
|
+ <label class="form-check-label" for="video_type_travel">
|
|
|
|
+ 幸福旅行
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_designer">
|
|
|
|
+ <label class="form-check-label" for="video_type_designer">
|
|
|
|
+ 王牌設計師
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_Treasure">
|
|
|
|
+ <label class="form-check-label" for="video_type_Treasure">
|
|
|
|
+ 街頭尋寶趣
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_two">
|
|
|
|
+ <label class="form-check-label" for="video_type_two">
|
|
|
|
+ 幸福二三事
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_Happiness">
|
|
|
|
+ <label class="form-check-label" for="video_type_Happiness">
|
|
|
|
+ 幸福大突擊
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_Award">
|
|
|
|
+ <label class="form-check-label" for="video_type_Award">
|
|
|
|
+ 獎空間獎設計
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_broadcast">
|
|
|
|
+ <label class="form-check-label" for="video_type_broadcast">
|
|
|
|
+ 幸福空間廣播
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_interview">
|
|
|
|
+ <label class="form-check-label" for="video_type_interview">
|
|
|
|
+ 媒體採訪
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="video_type" id="video_type_topics">
|
|
|
|
+ <label class="form-check-label" for="video_type_topics">
|
|
|
|
+ 主題精選
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ </ul>
|
|
|
|
+ </div>
|
|
|
|
+
|
|
|
|
+ <div class="dropdown">
|
|
|
|
+ <button class="btn dropdown-toggle fw-bold search-tab" type="button" id="tag_vpattern"
|
|
|
|
+ data-bs-toggle="dropdown" aria-expanded="false">
|
|
|
|
+ 空間格局
|
|
|
|
+ </button>
|
|
|
|
+
|
|
|
|
+ <ul class="dropdown-menu" aria-labelledby="tag_vpattern">
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="tag_vpattern" id="tag_vpatternall">
|
|
|
|
+ <label class="form-check-label" for="tag_vpatternall">
|
|
|
|
+ 不拘
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="tag_vpattern" id="tag_vpatternentrance">
|
|
|
|
+ <label class="form-check-label" for="tag_vpatternentrance">
|
|
|
|
+ 玄關
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="tag_vpattern" id="tag_vpatternliving">
|
|
|
|
+ <label class="form-check-label" for="tag_vpatternliving">
|
|
|
|
+ 客廳
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="tag_vpattern" id="tag_vpatternbedroom">
|
|
|
|
+ <label class="form-check-label" for="tag_vpatternbedroom">
|
|
|
|
+ 臥室
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="tag_vpattern" id="tag_vpatternlocker">
|
|
|
|
+ <label class="form-check-label" for="tag_vpatternlocker">
|
|
|
|
+ 更衣室
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="tag_vpattern" id="tag_vpatternchildren">
|
|
|
|
+ <label class="form-check-label" for="tag_vpatternchildren">
|
|
|
|
+ 兒童房
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="tag_vpattern" id="tag_vpatternjapanese">
|
|
|
|
+ <label class="form-check-label" for="tag_vpatternjapanese">
|
|
|
|
+ 和室
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="tag_vpattern" id="tag_vpatternstudy">
|
|
|
|
+ <label class="form-check-label" for="tag_vpatternstudy">
|
|
|
|
+ 書房
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="tag_vpattern" id="tag_vpatternrestaurant">
|
|
|
|
+ <label class="form-check-label" for="tag_vpatternrestaurant">
|
|
|
|
+ 餐廳
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="tag_vpattern" id="tag_vpatternkitchen">
|
|
|
|
+ <label class="form-check-label" for="tag_vpatternkitchen">
|
|
|
|
+ 廚房
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="tag_vpattern" id="tag_vpatternbathroom">
|
|
|
|
+ <label class="form-check-label" for="tag_vpatternbathroom">
|
|
|
|
+ 浴室
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="tag_vpattern" id="tag_vpatternaudiovisual">
|
|
|
|
+ <label class="form-check-label" for="tag_vpatternaudiovisual">
|
|
|
|
+ 視聽室
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="tag_vpattern" id="tag_vpatternbalcony">
|
|
|
|
+ <label class="form-check-label" for="tag_vpatternbalcony">
|
|
|
|
+ 陽台露台
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ <li>
|
|
|
|
+ <div class="form-check">
|
|
|
|
+ <input class="form-check-input" type="radio" name="tag_vpattern" id="tag_vpatterncommercial">
|
|
|
|
+ <label class="form-check-label" for="tag_vpatterncommercial">
|
|
|
|
+ 商業空間
|
|
|
|
+ </label>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ </ul>
|
|
|
|
+
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ <div class="row">
|
|
|
|
+ <div class="col-md-9">
|
|
|
|
+ <div class="d-flex flex-wrap align-items-center">
|
|
|
|
+ <div class="text-primary d-flex flex-wrap align-items-center search-tab-result">
|
|
|
|
+ <!-- <span class="me-3">
|
|
|
|
+ <span class="budget">
|
|
|
|
+ 接案地區:不拘
|
|
|
|
+ <img src="https://hhh.com.tw/assets/images/section/icon/close-btn-search.svg" alt="close-btn-search">
|
|
|
|
+ </span>
|
|
|
|
+ </span> -->
|
|
|
|
+
|
|
|
|
+ <!-- <button type="button" class="btn btn-light btn-sm text-muted px-3">全部清除</button> -->
|
|
|
|
+ </div>
|
|
|
|
+
|
|
|
|
+ <button type="button" id="removeResultBtn" class="btn btn-light btn-sm text-muted px-3">全部清除</button>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+
|
|
|
|
+ <div class="col-md-3">
|
|
|
|
+ <div class="d-flex justify-content-end search-btn-filter">
|
|
|
|
+ <button id="hot">
|
|
|
|
+ 人氣
|
|
|
|
+ </button>
|
|
|
|
+
|
|
|
|
+ <span class="mx-1">|</span>
|
|
|
|
+
|
|
|
|
+ <button id="new" class="active">
|
|
|
|
+ 最新
|
|
|
|
+ </button>
|
|
|
|
+
|
|
|
|
+ <span class="mx-1">|</span>
|
|
|
|
+
|
|
|
|
+ <button id="recommend">
|
|
|
|
+ 推薦
|
|
|
|
+ </button>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+
|
|
|
|
+ <!-- 讀取圖示 -->
|
|
|
|
+ <div class="text-center my-5" id="videoSpinner">
|
|
|
|
+ <div class="spinner-border text-primary" role="status">
|
|
|
|
+ <span class="visually-hidden">Loading...</span>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+
|
|
|
|
+ <!-- 設計師列表 -->
|
|
|
|
+ <div class="row mt-5" id="videoList">
|
|
|
|
+ <!-- 動態載入 -->
|
|
|
|
+ </div>
|
|
|
|
+
|
|
|
|
+ <!-- 分頁 -->
|
|
|
|
+ <div class="d-flex justify-content-center my-5">
|
|
|
|
+ <nav aria-label="Page navigation example">
|
|
|
|
+ <ul class="pagination border list-pagination">
|
|
|
|
+ <li class="page-item">
|
|
|
|
+ <a class="page-link" href="#" aria-label="Previous">
|
|
|
|
+ <span aria-hidden="true"><</span>
|
|
|
|
+ </a>
|
|
|
|
+ </li>
|
|
|
|
+ <li class="page-item">
|
|
|
|
+ <a class="page-link" href="#">1</a>
|
|
|
|
+ </li>
|
|
|
|
+ <li class="page-item">
|
|
|
|
+ <a class="page-link" href="#">2</a>
|
|
|
|
+ </li>
|
|
|
|
+ <li class="page-item">
|
|
|
|
+ <a class="page-link" href="#">3</a>
|
|
|
|
+ </li>
|
|
|
|
+ <li class="page-item">
|
|
|
|
+ <a class="page-link" href="#" aria-label="Next">
|
|
|
|
+ <span aria-hidden="true">></span>
|
|
|
|
+ </a>
|
|
|
|
+ </li>
|
|
|
|
+ </ul>
|
|
|
|
+ </nav>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+
|
|
|
|
+ <!-- 動態載入 -->
|
|
|
|
+ <div id="btn-box"></div>
|
|
|
|
+ <div id="footer" class="d-none d-lg-block"></div>
|
|
|
|
+
|
|
|
|
+ <!-- jQuery -->
|
|
|
|
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
|
|
|
|
+ <!-- Bootstrap -->
|
|
|
|
+ <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.10.1/dist/umd/popper.min.js"
|
|
|
|
+ integrity="sha384-W8fXfP3gkOKtndU4JGtKDvXbO53Wy8SZCQHczT5FMiiqmQfUpWbYdTil/SxwZgAN"
|
|
|
|
+ crossorigin="anonymous"></script>
|
|
|
|
+ <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.min.js"
|
|
|
|
+ integrity="sha384-skAcpIdS7UcVUC05LJ9Dxay8AXcDYfBJqt1CJ85S/CFujBsIzCIv+l9liuYLaMQ/"
|
|
|
|
+ crossorigin="anonymous"></script>
|
|
|
|
+ <script src="./js/main.js"></script>
|
|
|
|
+</body>
|
|
|
|
+
|
|
|
|
+</html>
|