์ ๋ช์ผ webgl๋ก ์ฌ๋ฆฐ ์ ๋ํฐ ์์ ์ฐจํธ๋ ๋ญ๋ ๋์๋๊ณ ์ ๋ํฐ ๋ด์ ๋ฐ์ดํฐ๋ฅผ jslib๋ก ๋ฐ์ ์ฐจํธ๋ก ํต๊ณ๋ด๊ฑฐ๋ ์ด๋ฐ ์ญํ ์ ํ๋ ค๊ณ ํ๋๋ฐ์.
์ ๊ฐ html์๋ ์ ๋ฌดํด์ ๊ฒ์ํด๋ ์ ๋ชป๋ฐ๋ผํด๋ณด๊ณ ๊ทธ๋ฐ๊ฒ ์ข ๋ง์ง ์ถ์๋ฐ,
canvas๋ฅผ div๋ก ๋ฐ๊ฟ์ z-index๋ฅผ ๊ฑด๋๋ ค๋ ์ฌ์ ํ๋ค์... ์์ง๋ถ๋...
๋ ์ ๋ํฐ๋ฅผ ์ฐจํธ ๋ค๋ก ๋ฃ๊ณ ์ถ์ต๋๋ค. ์ฐจํธ๊ฐ ํญ์ ์์ด๊ฒ์... ๋์์ฃผ์ธ์
์ ๋ฐ์์ผ๋ก ํ๋ฉด ์๋๊ณ , ์๋ฐ์คํฌ๋ฆฝํธ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ฅผ ๋ง๋ค๊ณ ๊ทธ๊ฑธ ์ ๋ํฐ์ ์ํฌํธ ํ๊ณ ์ ๋ํฐ๊ฐ ๊ทธ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ํตํด๊ฐ์ง๊ณ ๊ธฐ๋ฅ ํธ์ถ ํ๊ณ css ์์ ์ค๋ฒ๋ ์ด ์ ์ํด๋๊ณ ์ด๋ฐ์์ผ๋ก ํด์ผ webgl ์์ ๊ทธ๋ฆด ์ ์์
์ ์ด์ ์ง๊ธ ์ด์ฉํ๋ ค๋ ๊ธฐ๋ฅ์ด ์ ์ฐจํธ๊ธฐ๋ฅ + ๊ทธ๊ฒ webgl์์ ๊ทธ๋ ค๋ธ๋ค๋ ์ฐจ์ด ์ธ๋ฐ์.
ํ๋ ๋ ์ฌ์ญ์ด๋ณผ๊ฒ ์์ด์! ์ ์ฐจํธ ์์ฒด๊ฐ ์ด๋ฏธ jslib์ธ๋ฐ ์ jslib์์ ์ค๋ฒ๋ ์ด๋ง ์ ์ํด์ ์ฌ์ฉํ๋ฉด ๋๋ค. ์ด ๋ป์ธ๊ฐ์??
jslib ์์์๊ฐ ์๋๋ผ css ์๋ค๊ฐ
์ฐจํธ๋ ๋ณ๊ฐ๊ณ , css๋ก ํ๋ ๋ ์ง์ผํ๋ค. ๊ทธ ์์ ํ์ ์ ๋ง๋๋๋ฐ, ์ค๋ฒ๋ ์ด ํ๋ ํ์ ์ ์ง ๋ค ์ํฌํธ ํ๊ณ , ์ฐจํธ๋ unity๋ก ๋น๋ ๋ webgl์ด ๋ ๋ค ์ด ํ์ ์ ๊ฑฐ์ณ์ ๋์์ค์ผ ํ๋ค. ์ด๊ฑฐ๊ตฐ์?
์๋ css ๋ ํ์ ์ด ์๋๋ผ.. ์คํ์ผ ์ํธ์ผ.... ์น์ง์ ๋น๋ ํ๊ณ ๋๋ฉด css ์์์ ๊ทธ๊ฑธ ๊ณ ์น๋์ง ๋น๋ํ๊ธฐ ์ ์ ํ ํ๋ฆฟ ๊ณ ๋ฅด๋๊ฑฐ ์์์ ๊ทธ ํ ํ๋ฆฟ์ ์๋ก ๋ง๋ค๋์ง ์์ ์ ํ๋์ง.. ๋ ์ด๊ฑฐ ํด๊ฒฐํ๋ ค๋ฉด ์ค๋ ๊ฑธ๋ฆฌ๊ฒ ๋ค
์ฌ๊ธฐ์ ํ์ ์ด๋ผ ํ๊ฑด ๊ทธ๋ฐ ์ ๋ฌธ ์ฉ์ด๋ฅผ ๋งํ๋ค๊ธฐ ๋ณด๋ค๋ ๊ทธ ์ํธ์์ ์ด๋ฐ ๊ธฐ๋ฅ์ ๋ง๋ค์ด์ ์จ์ผํ๋ค ์ด๋ง์์ด์ฃ ? ๋ผ๋ ๋ป์ด์๋๋ฐ,,, ์คํด๋ฅผ ์ผ์ผ์ผฐ๋๋ณด๋ค์
์ฌ๊ธฐ์ ๋ค CSS ํ ์ค๋ชฐ๋ฆ