토글기능 구현 조언 부탁드립니다. 채택완료
헐크매니아
8년 전
조회 6,214
첨부한 그림처럼 사이트에 처음 접속하면 원하는 비율대로 right가 활성화 된 상태를 기본으로
처음 토글버튼을 누르면 right가 없어지고 그다음에는 다시 생기도록 하고싶습니다.
지금 제 소스대로 하면 디스플레이를 table,table-cell로 구현해서 left랑 right가 옆으로 놓이도록은
했는데 left 넓이가 100%니까 기본상태에서 left가 넓이를 다 먹어버리고요.
뭐 80%대 20%등등 여러가지를 해봐도 원하는대로 안나오네요.
조언좀 부탁드립니다.
</p><p><!doctype html></p><p><html></p><p><head></p><p><meta charset="utf-8"></p><p><title>무제 문서</title></p><p><style></p><p>.main {</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>width: 100%;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>display: table;<span class="Apple-tab-span" style="white-space:pre"> </span></p><p>}</p><p>#left {</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>width: 100%;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>height: 200px;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>background-color: #000;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>display: table-cell;</p><p>}</p><p>#right {</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>width: 250px;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>height: 200px;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>background-color: #3CF;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>display: table-cell;</p><p>}</p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p></style></p><p></head></p><p> </p><p><body></p><p><a href="javascript:ppp(right)">토글버턴</a></p><p><script>function ppp(id)</p><p> {if(id.style.display == 'none')</p><p> {id.style.display='block';}</p><p> else{id.style.display = 'none';}</p><p> }</p><p></script></p><p><div class="main"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div id="left"></p><p> </div></p><p> <div id="right"></p><p> </div></p><p></div></p><p></body></p><p></html></p><div>
댓글을 작성하려면 로그인이 필요합니다.
답변 2개
채택된 답변
+20 포인트
8년 전
http://nyaongii.dothome.co.kr/temp/wrid_175093.html">http://nyaongii.dothome.co.kr/temp/wrid_175093.html
혹 이런 걸 원하시는 건가요?
로그인 후 평가할 수 있습니다
답변에 대한 댓글 3개
�
헐크매니아
8년 전
헐 슬라이드까지 어떻게 하신건지?
�
왕계란
8년 전
소스 보기로 해서 보시면 됩니다.
animate() 메소드 사용한 것밖에 없습니다.
animate() 메소드 사용한 것밖에 없습니다.
�
헐크매니아
8년 전
근데 보니까 레이어로 따지면 하늘색이 검은색 위에 있는거네요. 저는 검은색,하늘색이
동등한 위치에 있는 상태에서 토글버튼을 누르면 검은색이 하늘색 넓이만큼 줄어들면서
하늘색이 생기는걸 생각중입니다.
동등한 위치에 있는 상태에서 토글버튼을 누르면 검은색이 하늘색 넓이만큼 줄어들면서
하늘색이 생기는걸 생각중입니다.
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인