亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

使用純 JavaScript 搜索過濾器,用于 HTML/CSS 中的圖像網格

使用純 JavaScript 搜索過濾器,用于 HTML/CSS 中的圖像網格

慕田峪7331174 2021-06-18 17:02:05
我來自葡萄牙的亞速爾群島,我正在做一個項目來展示亞速爾群島的小徑。我正在使用 html/css 中的圖像網格來顯示亞速爾群島的一些旅游機構,但我對其中一個要求有疑問,用純 JavaScript 構建了一個搜索過濾器來過濾島嶼的機構。如果有人可以幫助我,我將不勝感激,這是我的代碼!    <section class="oferta">            <h1 class="titulo">Oferta Turística</h1>            <div id="btn-container">                <button class="btn-oferta active" onclick="selecaoFiltro('todas')">Mostrar Todas</button>                <button class="btn-oferta active" onclick="selecaoFiltro('s-miguel')">S?o Miguel</button>                <button class="btn-oferta active" onclick="selecaoFiltro('terceira')">Terceira</button>                <button class="btn-oferta active" onclick="selecaoFiltro('graciosa')">Graciosa</button>                <button class="btn-oferta active" onclick="selecaoFiltro('s-jorge')">S?o Jorge</button>                <button class="btn-oferta active" onclick="selecaoFiltro('pico')">Pico</button>                <button class="btn-oferta active" onclick="selecaoFiltro('faial')">Faial</button>            </div>            <div class="oferta-container">                <div class="item filtro s-miguel">                    <div class="oferta-item" style="background-image: url(imgs/oferta/azores_getaways.png"></div>                    <h1>Azores Getaways - S?o Miguel</h1>                    <h2>Contactos:</h2>                    <a href="https://azoresgetaways.com/">WebSite - Azores Getaways</a>                    <p>Email: - [email protected]</p>                    <p>Telefone: +351 308 804 860</p>                </div>                <div class="item filtro s-miguel">                    <div class="oferta-item" style="background-image: url(imgs/oferta/melo_travel.png"></div>                    <h1>Melo Travel - S?o Miguel</h1>                    <h2>Contactos:</h2>                    <a href="http://www.melotravel.com">WebSite - Melo Travel</a>                    <p>Email: - [email protected]</p>                    <p>Telefone: +351 296 205 385</p>                </div>
查看完整描述

1 回答

  • 1 回答
  • 0 關注
  • 122 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號