iT邦幫忙

鐵人檔案

2023 iThome 鐵人賽
回列表
自我挑戰組

網站主題切換功能 系列

在這30天中,我將會使用CSS、JavaScript去嘗試製作一個可以切換主題的網站,讓使用者可以在不同的外觀風格之間進行切換。

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

Day21:日夜主題切換(1)

前言 在接下來的幾天中,我將要嘗試實作"日夜主題切換"功能,我預計使用 JavaScript 監測當前時間,當進入夜晚時,網頁將會自動切換網...

2023-10-01 ‧ 由 May0240 分享
DAY 22

Day22:日夜主題切換(2)

前言 今天我將著重在實作保存"日夜主題切換"功能的狀態,使網站能夠記住使用者是否啟用這個功能。除此之外,我還希望即使是在開啟"日夜...

2023-10-02 ‧ 由 May0240 分享
DAY 23

Day23:日夜主題切換(3)

前言 昨天,我已經完成保存"日夜主題切換"狀態的功能。今天,我的目標為實現自動判斷當前時間,以便確定是否切換到夜間主題的功能。 實作夜間主題...

2023-10-03 ‧ 由 May0240 分享
DAY 24

Day24:日夜主題切換(4)

前言 在昨天成功實現"日夜主題切換"功能後,我發現了一個問題:當我刷新網頁時,"日夜主題切換"功能的狀態會被重置,也就是...

2023-10-04 ‧ 由 May0240 分享
DAY 25

Day25:日夜主題切換(5)

前言 今天的目標為修復我在主題切換功能中遇到的 bug。當我在完成主題切換功能後,測試時發現一個問題:如果我先切換當前的主題,然後再按下"自動切換背景...

2023-10-05 ‧ 由 May0240 分享
DAY 26

Day26:在待辦事項中增加標記按鈕

前言 在前幾天的挑戰中,我已經成功將日夜主題切換的功能完成了。因為進度比我想的還要快一些,所以我接下來幾天會嘗試為待辦事項添加一些功能。今天的目標是為待辦事項添...

2023-10-06 ‧ 由 May0240 分享
DAY 27

Day27:僅顯示已標記的待辦項目(1)

前言 今天的目標中,我將試著實現篩選功能,該功能為僅顯示已標記的待辦項目。我會先添加一個篩選的選項,然後設定選到「已被標記的待辦事項」時,就將未被標記的待辦事項...

2023-10-07 ‧ 由 May0240 分享
DAY 28

Day28:僅顯示已標記的待辦項目(2)

前言 今天的目標是完成待辦事項的篩選功能。我將實作 filterCompletedItems() 和 showAllItems() 方法,讓使用者可以在網站上查...

2023-10-08 ‧ 由 May0240 分享
DAY 29

Day29:修改篩選器的樣式:消除下拉箭頭

前言 今天我將專注於修改篩選器的樣式。具體來說,我的目標是消除下拉選單中的箭頭,並且依照各個主題去更改背景顏色。 修改篩選器的樣式 首先,我需要調整一下 HTM...

2023-10-09 ‧ 由 May0240 分享
DAY 30

Day30:完賽心得

突然覺得時間過得好快,不知不覺就完成30天的鐵人賽,我其實很驚訝自己可以順利完賽。當初在選擇主題時,雖然有花費很長一段時間去規劃這30天內的主題和內容,但實際上...

2023-10-10 ‧ 由 May0240 分享