| ์ผ | ์ | ํ | ์ | ๋ชฉ | ๊ธ | ํ |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | ||
| 6 | 7 | 8 | 9 | 10 | 11 | 12 |
| 13 | 14 | 15 | 16 | 17 | 18 | 19 |
| 20 | 21 | 22 | 23 | 24 | 25 | 26 |
| 27 | 28 | 29 | 30 | 31 |
- ์น์ ๊ทผ์ฑ
- ์ฝ๋ฉ์์
- ์คํฌ๋ฆฐ๋ฆฌ๋์ง์
- ์๋ฐ์คํฌ๋ฆฝํธui
- ์น๊ฐ๋ฐ
- ์๋ฐ์คํฌ๋ฆฝํธ
- ๋คํฌ๋ชจ๋ํ ๊ธ
- ํ ๋ง์๋์ ํ
- ์ ๊ทผ์ฑ
- preferscolorscheme
- ์คํฌ๋กค์ ๋๋ฉ์ด์
- ๋ฐ๋๋ผ์คํฌ๋ฆฝํธ
- UX๋์์ธ
- uiux๋์์ธ
- ์นUI
- ๋ฐ๋๋ผjs
- UIUX
- css๋ณ์
- ๋ก์ปฌ์คํ ๋ฆฌ์ง
- js์คํฌ๋กค์ด๋ฒคํธ
- ์นui๋์์ธ
- ์๋ฐ์คํฌ๋ฆฝํธ์ปดํฌ๋ํธ
- ui์ปดํฌ๋ํธ
- css์ ๋๋ฉ์ด์
- ์ธํฐ๋ ํฐ๋ธui
- ๋คํฌ๋ชจ๋
- JavaScript
- ์น๋์์ธ
- ํ๋ก ํธ์๋
- ๋ฐ์ํ์น
- Today
- Total
๋ชฉ๋ก์ ๊ทผ์ฑ๋ชจ๋ฌ (1)
UI Code Lab
์ ๊ทผ์ฑ์ ๊ณ ๋ คํ ์ค์ ๋ชจ๋ฌ ๊ตฌํ๊ธฐ (Modal)
๋ชจ๋ฌ์ UI์์ ์์ฃผ ์ฐ์ด๋ ์ปดํฌ๋ํธ์ง๋ง, ์ ๊ทผ์ฑ๊น์ง ์ฑ๊ธด ๊ตฌํ์ ์๊ฐ๋ณด๋ค ๋๋ญ ๋๋ค. ์ด ๊ธ์์๋ ๊ธฐ๋ณธ์ ์ธ ๋ฐ๋๋ผ ์๋ฐ์คํฌ๋ฆฝํธ ๋ชจ๋ฌ ๊ตฌํ๋ฒ๋ถํฐ, ์คํฌ๋ฆฐ๋ฆฌ๋์ ํค๋ณด๋ ์ฌ์ฉ์๋ ๊ณ ๋ คํ ์ ๊ทผ์ฑ ๊ฐ์ ํฌ์ธํธ๊น์ง ๋ค๋ค๋ด ๋๋ค. ์ค๋ฌด์ ๋ฐ๋ก ์ ์ฉํ ์ ์๋ ์์ ์ฝ๋๋ ํจ๊ป ์ ๊ณตํ๋, ๋ณต์กํ ํ๋ ์์ํฌ ์์ด ์์ JS๋ก๋ ์ถฉ๋ถํ ๋ฉ์ง ์ ๊ทผ์ฑ ๋ชจ๋ฌ์ ๋ง๋ค์ด๋ณด์ธ์! โจ ๊ธฐ๋ณธ ๋ชจ๋ฌ ๊ตฌํ๊ฐ๋จํ ์๋ฐ์คํฌ๋ฆฝํธ๋ก ๋ฒํผ ํด๋ฆญ ์ ๋ชจ๋ฌ์ ๋์ฐ๊ณ ๋ซ๋ ๊ธฐ๋ณธ ๊ตฌ์กฐ์ ๋๋ค. โ HTML ๊ตฌ์กฐ ๋ชจ๋ฌ ์ด๊ธฐ ๋ชจ๋ฌ ์ ๋ชฉ ๋ชจ๋ฌ ๋ด์ฉ์ ๋๋ค. ๋ซ๊ธฐ โ JS ๊ธฐ๋ณธ ๋ก์ง const openBtn = document.getElementById('openModal');const closeBtn = document.getElementB..