๐ช ๊ฐ๋จํ ๊ธฐ๋ฅ ๊ตฌํ. Navigation Bar (Side) w/ JS
758 ๋จ์ด ์ฝ๋ ํ์ณ๋ณด๊ธฐ์ฝ๋ ํ์ณ๋ณด๊ธฐ
Responsive Side Navigation Bar in HTML CSS And JavaScript | Dashboard Sidebar Menu
HTML, JS
boxicons.com์ ์์ด์ฝ ๋ง๋ค
div... div๊ฐ ๋๋ฌด ๋ง์...
๋ ๋์จ ๋ณ์.classList.toggle("active")
CSS
ํ๋กํ ์ฌ์ง์์ object-fit: cover
transition: all 0.5s ease์ ๋ง๋ฒ
HOME CONTEN์์ width: clac(100% - 240px)์ left: 240px
opacity:0๊ณผ display:none์ ์ฐจ์ด
opacity:0๊ณผ pointer-events: none์ผ๋ก ๋ฐ์ํ ์ฝ๋ฉ
white-space: nowrap
๋ ์์ด์ฝ์ ์ผ์ชฝ ๋ง์ง์ ์์ ์ ์์ ํ ๊ฐ์ด๋ฐ๋ก ๋ง๋ค์ด์คฌ์ง์ด
๐ the source of this content
Author And Source
์ด ๋ฌธ์ ์ ๊ดํ์ฌ(๐ช ๊ฐ๋จํ ๊ธฐ๋ฅ ๊ตฌํ. Navigation Bar (Side) w/ JS), ์ฐ๋ฆฌ๋ ์ด๊ณณ์์ ๋ ๋ง์ ์๋ฃ๋ฅผ ๋ฐ๊ฒฌํ๊ณ ๋งํฌ๋ฅผ ํด๋ฆญํ์ฌ ๋ณด์๋ค https://velog.io/@maimade/simplecode05์ ์ ๊ท์: ์์์ ์ ๋ณด๊ฐ ์์์ URL์ ํฌํจ๋์ด ์์ผ๋ฉฐ ์ ์๊ถ์ ์์์ ์์ ์ ๋๋ค.
์ฐ์ํ ๊ฐ๋ฐ์ ์ฝํ ์ธ ๋ฐ๊ฒฌ์ ์ ๋ (Collection and Share based on the CC Protocol.)
์ข์ ์นํ์ด์ง ์ฆ๊ฒจ์ฐพ๊ธฐ
๊ฐ๋ฐ์ ์ฐ์ ์ฌ์ดํธ ์์ง
๊ฐ๋ฐ์๊ฐ ์์์ผ ํ ํ์ ์ฌ์ดํธ 100์ ์ถ์ฒ ์ฐ๋ฆฌ๋ ๋น์ ์ ์ํด 100๊ฐ์ ์์ฃผ ์ฌ์ฉํ๋ ๊ฐ๋ฐ์ ํ์ต ์ฌ์ดํธ๋ฅผ ์ ๋ฆฌํ์ต๋๋ค