練習1 ── alert 示警元件 https://jsfiddle.net/birdie2019/4ur1c7xf/34/

練習2 ── toast 吐司元件 https://jsfiddle.net/birdie2019/fmc6b8ht/49/ 研究了一下setTimeout()用法,經過自己的消化吸收寫成筆記記錄下來 分享筆記:https://hackmd.io/@birdie/SJisAlTcs 另外發現display無法做transition的效果,改用opacity

練習3 ── modal 互動視窗元件 https://jsfiddle.net/birdie2019/9p3zsthL/17/

練習4 ── 表單驗證 https://jsfiddle.net/birdie2019/bdavsur4/91/

練習5 ── collapse 折疊效果 https://jsfiddle.net/birdie2019/dkncrv03/43/ 認識了scrollHeight屬性,建議可以用圖去搜尋會比較好理解這個屬性 也順便學了clientHeight和offsetHeight

練習6 ── dropdown 下拉式選單 https://jsfiddle.net/birdie2019/xb0ka495/44/ 研究window.onclick怎麼使用並認識了matches()

練習7 ── carousel 輪播元件 https://jsfiddle.net/birdie2019/t6uxb9df/30/


此次教材心得分享: 一開始在腦袋裡會想很複雜,憑空亂想亂打code發現不是再刪掉再亂打,但其實不可能一下就到位,後來拿筆和紙先把需要的功能和自己的邏輯想法簡單的寫和畫下來,釐清自己現在需要怎麼做,方法有幾種,若這個方法不行,還可以用什麼方法可以做,這個方法看似很沒有效率,但真的對我幫助很大且完成此次所有作業。

按讚的人:

共有 1 則留言