iT邦幫忙

鐵人檔案

2021 iThome 鐵人賽
回列表
Modern Web

快搭上姐姐的`微`前端便車 系列

主要分享姐姐我在切版的工作當中,常見會處理到web版面技巧-以css及js/jq為例,並希望透過實際的範例應用,讓剛好需要做這項網頁互動的新手們有方向。◉‿◉

鐵人鍊成 | 共 30 篇文章 | 36 人訂閱 訂閱系列文 RSS系列文
DAY 11

達標好文 第11車廂-table界的神器!DataTables介紹篇(1)

延續上篇的table介紹,原本功能都要自己寫,那有沒有工具可以直接套用呢?有的!那就是神器DataTables拉! 簡介 DataTables 是 jQue...

2021-09-26 ‧ 由 切版姐姐 分享
DAY 12

第12車廂-table界的神器!DataTables介紹篇(2)

延續上篇<第11車廂-table界的神器!DataTables介紹篇(1)>,今日再介紹其他參數設定 好的!延續上篇<第11車廂-tabl...

2021-09-27 ‧ 由 切版姐姐 分享
DAY 13

第13車廂-table界的神器!DataTables介紹篇(3)

本篇要延續DataTables介紹,如何引用拓展包呈現響應式版本 好心建議要先看: 第11車廂-table界的神器!DataTables介紹篇(1)...

2021-09-28 ‧ 由 切版姐姐 分享
DAY 14

第14車廂-點開看更多?tableRWD應用篇

本篇延續手刻tableRWD應用,將範例配合選取器改為響應式隱藏欄位並能展開 上幾篇介紹table神器後,是不是已經忘了我們手刻table系列哩?本系列相關...

2021-09-29 ‧ 由 切版姐姐 分享
DAY 15

第15車廂-data-*的坑?data-*介紹篇

本篇介紹data-*常用抓取方法,以及需注意的地方 我們在<第9車廂-使用content:attr()實現tableRWD應用篇>,其實已經有用...

2021-09-30 ‧ 由 切版姐姐 分享
DAY 16

第16車廂-提示我一下嘛!bootstrap-tooltip應用篇

昨篇已介紹data-*基本介紹,這篇介紹data於bootstrap上的使用 關於提示框,其實工作上真的會用到,但以前都用手刻,沒仔細看bootstrap居...

2021-10-01 ‧ 由 切版姐姐 分享
DAY 17

第17車廂-超實用!tab頁籤切換:data-*應用篇

本篇介紹常用的tab切換功能,使用js、jq、Vue3如何做到,以及說明若一個版面會出現一個以上需要切換時,該注意什麼? 還記的我們在<第15車廂-d...

2021-10-02 ‧ 由 切版姐姐 分享
DAY 18

第18車廂-動ㄘ動ㄘ!tab頁籤切換+輪播應用篇

本篇介紹透過bootstrap4直接使用tab切換功能,並且實作tab切換自動循環播放 我們在昨篇<第17車廂-超實用!tab頁籤切換:data-應用...

2021-10-03 ‧ 由 切版姐姐 分享
DAY 19

第19車廂-娃!網頁必備的響應式輪播效果怎麼刻?

本篇分享簡易版的RWD的輪播效果功能 上一篇我們有簡約的使用tab做輪播,但一般想做的輪播應該會是做在Banner的,但偏偏新手的我,想在網路上找要不就是用...

2021-10-04 ‧ 由 切版姐姐 分享
DAY 20

第20車廂-你知道slick.js輪播套件可以這樣用?

本篇介紹使用slick.js輪播套件應用在兩列以上的輪播功能以及介紹slickGoTo()方法 線上輪播套件有很多,自己常用的除了有slick,還有Owl...

2021-10-05 ‧ 由 切版姐姐 分享