• AI
  • Front-End
    • API
    • PWA
  • Google
    • Analytics
    • Apps Script
    • Firebase
    • Forms
    • Sheets
    • Maps
    • Others
  • Bot
    • Telegram
    • LINE
    • Slack
  • Vue
  • WordPress
  • 所有筆記文
  • AI
  • Front-End
    • API
    • PWA
  • Google
    • Analytics
    • Apps Script
    • Firebase
    • Forms
    • Sheets
    • Maps
    • Others
  • Bot
    • Telegram
    • LINE
    • Slack
  • Vue
  • WordPress
  • 所有筆記文
Let's Write 2025

Let's Write

Tag:Collapse

用原生 JS 做一個簡單的手風琴 Accordion / Collapse 功能
  • August
  • 2021-07-23
  • Front-End

用原生 JS 做一個簡單的手風琴 Accordion / Collapse 功能

本篇大綱:從jQuery到原生JS、HTML、CSS、JavaScript、原始碼下載。今年開始在工作時逼自己寫原生的JS(Vanilla JavaScript),今天趁著意外的假日,試著把手風琴用原生JS寫了一個出來。寫完後發現,其實沒幾行就可以完成,也有了一點小小的成就感。

10
用 CSS :target 製作頁籤、手風琴功能
  • August
  • 2020-12-11
  • Front-End

用 CSS :target 製作頁籤、手風琴功能

本篇大綱:本篇要解決的問題。頁籤 Tab。手風琴 Collapse。本篇算是對 :target 選擇器的小練習,是真的可以不用寫 JavaScript 就做出頁籤、手風琴這二個功能。

0

Widgets

Let’s Write 來訪人數

  • 1,045,019 位大大相挺,謝謝。

Reader Revenue Manager

Recent Comments

  • 「Stephen」於〈CodiumAI PR-Agent,在 Gitea 上用 AI 來 Code Review〉發佈留言
  • 「August」於〈使用 Gitea Actions 與 OpenAI 實現自動化 PR Code Review〉發佈留言
  • 「insleker」於〈使用 Gitea Actions 與 OpenAI 實現自動化 PR Code Review〉發佈留言
  • 「Tia」於〈mailto: 點擊連結 開啟寄送 email〉發佈留言
  • 「Stu」於〈用 Google Sheets 紀錄表單資料〉發佈留言

DMCA

DMCA.com Protection Status

Popular Posts

  • 免費開源的語音辨識功能:Google Colab + Faster Whisper
  • 用 Gitea 在本機架 Git Server 功能
  • OSM + Leaflet 學習筆記 1:建地圖、marker、事件、換圖層
  • OpenClaw:安裝教學,在 macOS 用虛擬機 (Ubuntu) 安全部署龍蝦 AI
  • 免費開源的語音辨識功能:Google Colab + Whisper large v3

Random Post

  • 用 Docker 安裝 Verdaccio,建立本機私有 npm

    用 Docker 安裝 Verdaccio,建立本機私有 npm

  • 用 reCAPTCHA v3 來做非機器人驗證

    用 reCAPTCHA v3 來做非機器人驗證

  • LIFF v2 基本使用筆記及範例

    LIFF v2 基本使用筆記及範例

Social links

Subscribe

直接加入 Telegram 的頻道,有最新文章時會收到廣播通知:

© 2025 Let's Write. All Rights Reserved.

Popular Posts

  • 免費開源的語音辨識功能:Google Colab + Faster Whisper
  • 用 Gitea 在本機架 Git Server 功能
  • OSM + Leaflet 學習筆記 1:建地圖、marker、事件、換圖層
  • OpenClaw:安裝教學,在 macOS 用虛擬機 (Ubuntu) 安全部署龍蝦 AI
  • 免費開源的語音辨識功能:Google Colab + Whisper large v3
  • CodiumAI PR-Agent,在 GitHub 上用 AI 來 Code Review
  • iPhone 的語音辨識功能:語音備忘錄,自動標點分段
  • CodiumAI PR-Agent,在 Gitea 上用 AI 來 Code Review

Recent Posts

  • Outline Wiki 自架教學(一):Docker 安裝、Gitea OIDC 與 AI 知識庫
  • OpenClaw:安裝教學,在 macOS 用虛擬機 (Ubuntu) 安全部署龍蝦 AI
  • 站內搜尋加上 AI:使用 Google Vertex AI Search(RAG)打造智慧問答型搜尋
  • CodiumAI PR-Agent,在 Gitea 上用 AI 來 Code Review
  • 在本機安裝 Mattermost:打造自主控制的團隊通訊平台