์ ์ฒด ๊ธ40 ์ฑ ์ถ์ฒ ๋ชจ๋ ์น์ ์ํ JavaScript + jQuery ์ ๋ฌธ ์ค์ธ์ฑ ์ ์ํ๋น๋ฏธ๋์ด ์๋ฐ์คํฌ๋ฆฝํธ ์๋ฒฝ ๊ฐ์ด๋๋ฐ์ด๋น๋ ํ๋๋๊ฑด ์ ์์ธ์ฌ์ดํธ ์๋ฐ์คํฌ๋ฆฝํธ ์ฝ๋ฉ ๊ธฐ๋ฒ๊ณผ ํต์ฌ ํจํด์คํ ์ ์คํ ํ๋ ธํ ์ ์์ธ์ฌ์ดํธ ์๋ฐ์คํฌ๋ฆฝํธ ์น ์ ํ๋ฆฌ์ผ์ด์ ์๋ ์ค ๋งฅ์นด์ฐ ์ ์ํ๋น๋ฏธ๋์ด ์๋ฐ์คํฌ๋ฆฝํธ ์ฑ๋ฅ ์ต์ ํ๋์ฝ๋ผ์ค ์์นด์ค ์ ์ํ๋น๋ฏธ๋์ด 2012. 9. 25. ์น์ ๋ง๋ค์ด๊ฐ๋๋ฐ ์์ด์ ์์งํด์ผํ ์น ์ ๊ทผ์ฑ[๋์์ธ] ๋์์ธ์ ์์ ๋ฐ๋์ ์์งํด์ผ ํ ์ฌํญ์์์ผ๋ก ํํ๋ ์ ๋ณด๋ ์์์ ๋ฐฐ์ ํ์ฌ๋ ์ํ๋ ๋ด์ฉ์ ์ ๋ฌํ ์ ์์ด์ผ ํ๋ค.์ ๊ฒฝ์๊ณผ ๋ฐฐ๊ฒฝ์์ ์ถฉ๋ถํ ๋๋น๋ฅผ ๊ฐ์ง๊ณ ์์ด์ผ ํ๋ค.ํ ์คํธ๋ ์ฝ๊ฒ ์ฝ์ ์ ์๋๋ก ์ถฉ๋ถํ ํฌ๊ธฐ๋ ์ ๊ณต๋์ด์ผ ํ๋ค.(KADO์ ํ์ง๋งํฌ ์ธ์ฆ ๊ธฐ์ค์ ์ํ๋ฉด ํ๋ ํ๊ธฐ ์ฌ์ด ํ ์คํธ์ ์ถฉ๋ถํ ์ต์ ํฌ๊ธฐ๋ 12px๋ก ์ ์ํ๊ณ ์์.์ด์ฉ์ ์๊ฐ์ ํ์ด ์๋ ์ฝํ ์ธ ์ ๊ฒฝ์ฐ ๊ฒฝ๊ณ ๋ฐ ์๊ฐ์กฐ์ ๊ธฐ๋ฅ์ ์ ๊ณตํ์ฌ์ผ ํ๋ค.ํ์ ์ฐฝ์ ๋ถํ์ํ๊ฒ ์ฌ์ฉํ์ง ์์์ผ ํ๋ค.๊ฐ ๋งํฌ์ ๋ชฉํ ์์น๋ฅผ ๋ช ํํ๊ฒ ํ์ฌ์ผ ํ๋ค. ์์์ผ๋ก ํํ๋ ์ ๋ณด๋ ์์์ ๋ฐฐ์ ํ์ฌ๋ ์ํ๋ ๋ด์ฉ์ ์ ๋ฌํ ์ ์์ด์ผ ํจ. ๋ํ์ ๋ชจ์์ ๋ฌ๋ฆฌ ํ์ฌ ์ ๋ฟ๋ง ์๋๋ผ ๋ํ์ ๋ชจ์์ผ๋ก ๊ตฌ๋ถ์ด ๊ฐ๋ฅํ๊ฒ ํจ. ๋ช ๋ ๋๋น๋ ์ต์ 4.51:1์ ์ ์งํด์ผ ํจ๋ฐฐ๊ฒฝ์์ด.. 2012. 9. 25. ์น์ ๋ง๋ค์ด๊ฐ๋๋ฐ ์์ด์ ์์งํด์ผํ ์น ์ ๊ทผ์ฑ[ํ๋ก๊ทธ๋จ] ํ๋ก๊ทธ๋จ ๊ฐ๋ฐ์ ์์ ๋ฐ๋์ ์์งํด์ผ ํ ์ฌํญ.๋ถํ์ ํ๊ฑฐ๋ ๊ณผ๋ํ๊ฒ ๋ง์ ํ๋ ์์ ์ฌ์ฉํ์ง ์์์ผ ํ๋ค.ํค๋ณด๋๋ง์ผ๋ก ๋ชจ๋ ์ฝํ ์ธ ๋ฅผ ์ ์ดํ ์ ์์ด์ผ ํ๋ค.๊ฐ ์์ ์ ์ด ์์๋ฅผ ์ค๋ช ํ๋ ๋ ์ด๋ธ์ ์ฌ์ฉํ์ฌ์ผ ํ๋ค.ํค๋ณด๋๋ง์ผ๋ก๋ ์จ๋ผ์ธ ์์ ์ ๋ ฅ ๋ฐ ์์ ๊ฐ ์ด๋์ด ๊ฐ๋ฅํ์ฌ์ผ ํ๋ค.์คํฌ๋ฆฝํธ, ์ ํ๋ฆฟ, ํ๋ฌ๊ทธ์ธ ๋ฑ ๋ถ๊ฐ ์ดํ๋ฆฌ์ผ์ด์ ์ ์ํ ์ฝํ ์ธ ๋ ์์ฒด์ ์ธ ์ ๊ทผ์ฑ์ ์ง๋๊ณ ์์ด์ผ htmlํ์ด์ง์ ํ๋ก๊ทธ๋จ์ ์ ํ๋ฉด์ ์ฌ๋ฐ๋ฅธ ํ๊ทธ๋ฅผ ์ฌ์ฉํ์ง ์๋ ๊ฒฝ์ฐ์ต๊ทผ ๊ฐ๋ฐ๋ ์ฌ์ดํธ๋ ๋๋ถ๋ถ XHTML 1.0 Transitional ํ์ ์ด์ง๋ง ๊ฐ๋ฐ์ ๋๋ถ๋ถ์ ๊ทธ์ ๋ง๋ ํ๊ทธ ์ง์์ด ์์. ์ต์ด ๋ง๋ค์ด์ง html ๋ฌธ์์ ํจ๊ป ๊ฐ๋ฐ๊ณผ ์ฐ๊ด๋ ํ๊ทธ ๊ฐ์ด๋๋ผ์ธ ์ ๊ณต ํ์. - DTD๊ฐ XHTMLํ์์ผ ๋์๋ ๋ซ๊ธฐ์ ๋ฐ์ดํ๋ฅผ ์๋ตํ .. 2012. 9. 25. min-height:100% ๋ฅผ ์ด์ฉํด์ footer๋ฅผ ํ๋ฉด์๋์ ๊ณ ์ ํ๊ธฐ /* html */headercontainer footer /* css */ html, body{width:100%height:100%}html{width:100%;height:100%}body{width:100%;height:100%} html๊ณผ body์ height:100%๋ฅผ ์ ์ฉ์ํต๋๋ค. #header{width:100%;height:50px;position:relative;z-index:20;overflow:hidden;background-color:#fcc} ๋ฐฑ๊ทธ๋ผ์ด๋์ปฌ๋ฌ๋ ์ ๋จนํ๋์ง ํ์ธ์ ์ํ๊ฒ์ผ๋ฟ์ ๋๋ค.๋์ด๊ฐ์ ๊ผญ header์ ์ ํด์ฃผ์ด์ผ๋๋ฉฐ position์ด ํ์๋ก ์์ด์ผ์ง container๊ฐ ์ฌ๋ผ์์๋ z-index๋ฅผ ์ด์ฉํด์ container์์ ์ฌ๋ผ์ฌ์์์ต๋๋ค.(z-index์ .. 2012. 9. 18. ์ด์ 1 ยทยทยท 7 8 9 10 ๋ค์