章節連結
這回在實務上，需根據資料生出一群可供點擊的長方形按鈕以及分群的區塊長度。這邊筆記下關鍵思維和實作方式。
內容
1. 改變 <label> 樣式，並依據當前點擊位置來動態綁定視覺效果。此處的 focus 效果是模擬的，理由是當 <input> 標籤設定為 hidden 時，它並不能被聚焦，所以就無法起 :focus-within, :focus 的效果。
2. 將原始的資料結構，轉換成依照號碼順序的區段 array。每一個區段會有起始值、終止值以及計數。最後根據計數來生成對應的長度，長度的算法為 ${count * <長方形寬度> + (count - 1) * <長方形間隔寬度>}px
按讚加入粉絲團
