| 레이어 내용 수정하기 | go style 도안 |
사용자가 폼의 입력한 내용을 페이지뿐만 아니라 레이어에도 보여줄 수 있습니다.
레이어에 보여준다면 레이어의 여러 property를 사용하여 더 재미있는 효과를 낼수 있습니다.
레이어의 내용을 수정할 수 있는 방법은 ie4의 경우 css-p 레이어가 가지고 있는 innerText, innerHTML로 지정하면 수정합니다. innerText는 단순히 레이어안의 글자들만 바꾸는 것이고 innerHTML은 HTML자체를 바꾸는 것입니다. innerHTML에는 html 택을 지정할 수 있습니다.
nn4는 위의 두 property를 지원하지 않습니다. 레이어가 가지고 있는 것들을 레이어의 document 인데, 이 document를 바꾸어 주어서 내용을 수정할 수 있습니다. <layer>, css-p 둘 다 마찬가지입니다. 글자나 html 택을 둘 다 지정하면 됩니다. 사용하는 형식은
레이어.document.open(); 레이어.document.write(내용); 레이어.document.close();으로 페이지에 document를 쓰는것과 같습니다. 레이어.document.open()은 지정하지 않아도 됩니다.
ie4는 innerText, innerHTML에 지정하면 됩니다. 형식은
레이어.innerText = "내용" 레이어.innerHTML = "내용"으로 지정합니다.
<div id=D1 style="position:absolute; color:red; font-size:10pt">10pt 빨간색 글자</div>style color:red; font-size:10pt 인 레이어의 내용을 color:blue; font-size:20pt 로 바꾸기 위해서 사용하는 형식은 ie4는
document.all.D1.innerHTML = '<span style="color:blue; font-size:20pt">파란색 20pt글자</span>'으로 지정합니다. span 택 뿐만아니라 다른 택도 사용할 수 있습니다. span html을 지정하기 위해서 innerHTML을 사용했습니다. 단순히 글자만 지정할 때는 innerText도 사용할 수 있습니다.
document.D1.document.open();
document.D1.document.write('<span style="color:blue; font-size:20pt">파란색 20pt글자</span>');
document.D1.document.close();
로 레이어의 document.write()안에 글자만도 지정할 수 있고 html 택도 넣어줄 수 있습니다.
이런 레이어의 내용을 바꾸어 주는 것으로 좀 더 생동감있는 페이지를 만들수 있고 연속적으로 바꾸어 주면 TV에 나오는 것처럼 글자들을 확대, 축소도 가능합니다. 글자만으로 움직이는 영상을 얻을 수 있습니다.