티스토리 뷰

WS & SCript

IE - OneTime Expression

Ming's 2008. 4. 24. 18:34

일반적으로 Expression을 사용하게 되면 이벤트가 일어날때마다 실행되어,
자칫 브라우저를 다운시키는 결과를 초래하게 될 수도 있다.
쓸데없는 이벤트에서의 사용을 막기 위해, One-Time Expression 방법을 사용한다.

아래는 body에서 P태그를 사용했을 경우,
시간별로 배경색을 바꾸어주는 예제이다.
해당 P 태그당 한번씩 expression을 실행시켜준다.

<span style="font-family: &quot;맑은 고딕&quot;, sans-serif;">&lt;style tyle="text/css"&gt; p {backgroud-color:expression(altBgcolor(this))} &lt;/style&gt; &lt;script type="text/javascript"&gt; function altBgcolor(elem) { elem.style.backgroundColor = (new Date()).getHours()%2 ? "#F08A00" : "B8D4FF" } &lt;/script&gt; </span>

아래는 IE에서의 min-width값을 expression을 이용하여 구현하였다.
기본 100%의 width값을 가지고 있되, 600px 보다 브라우저가 작을 경우에
최소 600px의 사이즈를 유지하도록 되어있다.

<span style="font-family: &quot;맑은 고딕&quot;, sans-serif;">&lt;style&gt; P { width: expression( setElemWidth(this) ); min-width: 600px; border: 1px solid; } &lt;/style&gt; &lt;script type="text/javascript"&gt; function setMinWidth() { var aElements = document.getElementsByTagName("p"); for ( var i = 0; i &lt; aElements.length; i++ ) { aElements[i].runtimeStyle.width = ( document.body.clientWidth&lt;600 ? "600px" : "auto" ); } } function setElemWidth(elem) { elem.runtimeStyle.width = ( document.body.clientWidth&lt;600 ? "600px" : "auto" ); } if ( -1 != navigator.userAgent.indexOf("MSIE") ) { window.onresize = setMinWidth; } &lt;/script&gt; </span>
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
«   2025/08   »
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31
글 보관함