# 2024/09/30 切切切會議
###### tags: `切切切會議記錄`

會議時間：2024/09/30 下午1:30
會議地點：台北（2124D會議室）、新竹（R3116會議室）
會議主持人：吳玟諭
會議記錄：麥莉
與會人員：琬樺、恬恬、雅瓊、玟諭、Lize、麥莉、思晨、祺學

---

## 1） filter()方法分享
> 主講人：吳玟諭
> [簡報連結 🌐](https://hackmd.io/@anniewu00/HyL3Zc8LR)

**Tip：**
1. 設定一個條件，不符合條件的元素將從選擇中移除，符合條件的元素將被傳回。
2. 可以選擇多筆，用逗號來區分，例如： $('p,div,a')
3. 也可以是屬性(attribute)，例如：$('[ fancy-box="image"]')
4. filter() 括號內寫篩選出的項目，也可以寫成多筆用逗號區分（‘.highlight, .top')

## 2） CSS 新語法和新功能
> 主講人：姚雅瓊
> [css 的巢狀語法：可以像scss一樣寫css，而且更強大（暫時連到官方文件）](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_nesting/Using_CSS_nesting)
> [:has() －可以指定上層和前面的元件](https://hackmd.io/0_XIq-MmTpmbLxOM288ddg?view)
> [:is(), :where()](https://hackmd.io/Mh-p-DzxSUWut3UrDbfmFw?view)
> 重複漸層
> repeating-linear-gradient() 【[範例一](https://codepen.io/yachiung/pen/GRbwzbY)】【[範例二](https://codepen.io/yachiung/pen/OJeaqYy)】【[範例三](https://codepen.io/yachiung/pen/NWZEmGd)】
> repeating-conic-gradient() 【[範例四](https://codepen.io/yachiung/pen/KKjrYgy)】
> repeating-radial-gradient() 【[範例五](https://codepen.io/yachiung/pen/oNrQOov)】
> 其他
* [width: min-content 在英文水平選單的應用](https://codepen.io/yachiung/pen/GRbqpYR?editors=1100)
* [表格內資料使用刪節號](https://codepen.io/yachiung/pen/RwzMvmK?editors=1100)
* [block元件內可使用align-content垂直置中，不用下flex](https://hackmd.io/@zyMaHiD6Rf6jIg67ijLJbQ/S1tnuR70A)
* [accent-color 變更checkbox/radio顏色](https://codepen.io/veelatseng/pen/XWvbGYN)

**Tips：**
1. 在CSS巢狀中，“&”可以省略
2. is()，只要符合在小括號內的任一條件，其他有錯誤的部分會忽略
3. 表格內資料使用刪節號，在`<td>`中要包`<div>` or `span`之類

## 3）Web API分享 第二彈
> 主講人：曾祺學
> [簡報連結 🌐](https://hackmd.io/hwoTTKGkRF-0L9KNTVaqLw)

**Tips：**
1. **Element.getBoundingClientRect()**：可用來偵測物件與視窗的距離。
2. **Element.scrollIntoView**：更容易達到捲軸捲動到某個物件位置的需求。
3. **RequestAnimationFrame**：製作連續執行的動作時比較不耗資源，畫面較流暢。
4. **DesignMode**：可以讓瀏覽者直接在網站上編輯文字，但是無法儲存。
5. **History**：可以用來做詐騙網站（誤

---
## 工作遇到的問題
> 1. HyUI_v4 Android手機查詢區塊，當按了查詢輸入框出現手機鍵盤，將手機鍵盤收起時遮罩會不見，重新按放大鏡收起查詢區塊，但遮罩會出現，再按放大鏡出現查詢區塊遮罩沒出現，變成不同步(by 淑雅)

> 2. 是否新增一組左側選單，至少有3層(by 淑雅)

> 3. 切切切相關資料庫
>* 無障礙清單資料庫
https://hackmd.io/EYTRQlziQbSzF7RSQp27rQ?view
>* 疑難排解資料庫
https://hackmd.io/eW9e6toeR5C4h-sr0DTO3A?view
>* css分享資料庫
https://hackmd.io/vUncOWqzQWas_IOKs6CpFg?both
>* Hyui flex修改討論
https://hackmd.io/nttxSvu8SM2TqWWirSLcmQ

---
## 臨時動議

---
## 專案分享
[**專案連結 🌐**](https://docs.google.com/spreadsheets/d/1t_fthnYUL4EWfBYsXrt6fbE3b4cDA8Fmx1aJZ6RN-lc/edit#gid=565687535)