(已解決)AMP如何做出跳出搜尋欄位?

amp 前端

tsuyo0928 2018-10-19 14:31:25 ‧ 1385 瀏覽

分享至

我想在AMP中製作一個點擊按鈕後跳出搜尋欄位的功能，使用了AMP的light-box,但是一旦點擊後就會自動關閉視窗，無法順利輸入欄位內容。
想請問是否弄錯套件或是少寫了什麼?或是該改用其他套件?

tsuyo0928 iT邦新手 5 級 ‧ 2018-10-24 10:22:47 檢舉

已解決，因為放錯了關閉位置，把on="tap:search-lightbox.close" 放到 div class="lightbox" 裡面，造成了點擊後立即關閉

語法:
<amp-lightbox id="search-lightbox"
layout="nodisplay">
<div class="lightbox"
tabindex="0">
<h4 class="modal-title text-center">搜尋</h4>
<form method="GET"
class="p2"
action="/components/amp-form/submit-form"
target="_top">
<div class="ampstart-input inline-block relative mb3">
<input type="search"
placeholder="Search..."
name="googlesearch">
</div>
<input type="submit"
value="OK"
class="ampstart-btn caps">
</div>
<button on="tap:search-lightbox.close">關閉視窗</button>
</amp-lightbox>

登入發表討論