:::

10. 彈跳視窗(燈箱) Modals

行內彈跳視窗

  • class="modal"可將之變成一個彈跳視窗(點了才會出現的視窗)
  • 按鈕的 href 連結要和視窗的 id 相對應
<p><a class="button" href="#example-modal">行內彈跳視窗</a></p>
<div id="example-modal" class="modal">
  視窗內容
</div>

以連結來當作視窗內容

  • 主要就是將連結改為 class="modal button"
  • href 的值為一般網址。
  • 不須要有對應內容
<p><a class="modal button" href="連結網址">外部內容 <i class="icon-external-link"></i></a></p>

開啟Youtube

  • 直接將影片網址填入即可
<p><a class="modal button" href="http://www.youtube.com/embed/eDO23-eLoGA">YouTube 影片</a></p>

 


:::

搜尋

QR Code 區塊

https%3A%2F%2Ftad0616.cp27.secserverpros.com%2Fmodules%2Ftad_book3%2Fpage.php%3Ftbdsn%3D842%26tbsn%3D29

書籍目錄

展開 | 闔起

線上使用者

274人線上 (110人在瀏覽線上書籍)

會員: 0

訪客: 274

更多…